博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
基础JavaScript 实例学习
阅读量:4300 次
发布时间:2019-05-27

本文共 1003 字,大约阅读时间需要 3 分钟。

1)写入 HTML 输出

实例:                                                                                                                                                              

document.write("

This is a heading

");document.write("

This is a paragraph

");

用document.write("") 轻松写入HTML。

2)对事件作出反应

这里实际涉及到两个技术,一个是onclick,表示用户点击时触发的动作。alert(),是默认的弹出框。

3)改变 HTML 内容

x=document.getElementById("demo")  //查找元素x.innerHTML="Hello JavaScript";    //改变内容

4)改变 HTML 图像

<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
  {
  element.src="/i/eg_bulboff.gif";
  }
else
  {
  element.src="/i/eg_bulbon.gif";
  }
}
</script>
<img id="myimage" οnclick="changeImage()" src="/i/eg_bulboff.gif">
<p>点击灯泡来点亮或熄灭这盏灯</p>
5)改变 HTML 样式
x=document.getElementById("demo")  //找到元素x.style.color="#ff0000";           //改变样式
6) 验证输入

if isNaN(x) {alert("Not Numeric")};

<input id="demo" type="text">

<script>
function myFunction()
{
var x=document.getElementById("demo").value;
if(x==""||isNaN(x))
{
alert("Not Numeric");
}
}
</script>
<button type="button" οnclick="myFunction()">点击这里</button>

参考链接:http://www.w3school.com.cn/js/js_intro.asp

转载地址:http://covws.baihongyu.com/

你可能感兴趣的文章
JavaWeb学习-案例练习-图书管理-13-添加购物车的实现过程
查看>>
JavaWeb学习-案例练习-图书管理-14-购物车页面小计删除商品和金额总计实现
查看>>
RestAssured接口自动化从入门到框架搭建-12-请求数据的设置(二) Headers&Cookies
查看>>
RestAssured接口自动化从入门到框架搭建-13-响应断言-状态码/Header/ContentType
查看>>
RestAssured接口自动化从入门到框架搭建-14-响应断言-使用Java 8 lambda表达式和响应时间测量
查看>>
RestAssured接口自动化从入门到框架搭建-15-RequestSpecBuilder和ResponseSpecBuilder和日志打印使用
查看>>
RestAssured接口自动化从入门到框架搭建-16-baseURI和basePath
查看>>
RestAssured接口自动化从入门到框架搭建-17-处理SSL和TLS协议
查看>>
JavaWeb学习-Filter-1-过滤器Filter快速入门
查看>>
JavaWeb学习-Filter-2-Filter声明周期和FilterConfig
查看>>
RestAssured接口自动化从入门到框架搭建-18-序列化和反序列化
查看>>
RestAssured接口自动化从入门到框架搭建-19-解析和认证
查看>>
JavaWeb学习-Filter-3-Filter实现自动登录
查看>>
JavaWeb学习-Filter-5-Filter实现全局编码过滤器
查看>>
使用perl批量卸载软件
查看>>
集合的运算
查看>>
安装nvidia驱动需要的准备工作
查看>>
快速生成background-1.xml的方法
查看>>
is not in the sudoers file解决方法
查看>>
linux配置JDK环境
查看>>