【1.0】JavaScript简介
JavaScript (简称JS,和Java没任何关系)
- 一种轻量级的脚本型编程语言
- 为Web增加了交互、动态效果和行为功能,被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。
- JS由浏览器执行,访问时会被下载到本地
- JS可以写在HTML文件中,也可以单独为.js文件
一、JavaScript:写入 HTML 输出
实例:
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
二、JavaScript:对事件作出反应
实例
<button type="button" onclick="alert('Welcome!')">点击这里</button>
alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。
onclick 事件只是您即将在本教程中学到的众多事件之一。
三、 JavaScript:改变 HTML 内容
使用 JavaScript 来处理 HTML 内容是非常强大的功能。
实例
x=document.getElementById("demo") //查找元素
x.innerHTML="Hello JavaScript"; //改变内容
您会经常看到 document.getElementByID(“some id”)。这个方法是 HTML DOM 中定义的。
DOM(文档对象模型)是用以访问 HTML 元素的正式 W3C 标准。
四、 JavaScript:改变 HTML 图像
本例会动态地改变 HTML <image>
的来源 (src):
The Light bulb
点击灯泡就可以打开或关闭这盏灯
<!DOCTYPE html>
<html>
<<span style="color: #333333; font-family: 'Courier 10 Pitch', Courier, monospace; font-size: 13px; font-style: normal; line-height: 1.5;">ript></span>
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" onclick="changeImage()" src="/i/eg_bulboff.gif">
<p>点击灯泡来点亮或熄灭这盏灯</p>
</body>
<span style="color: #333333; font-family: 'Courier 10 Pitch', Courier, monospace; font-size: 13px; font-style: normal; line-height: 1.5;"></html></span>body>
<sc
JavaScript 能够改变任意 HTML 元素的大多数属性,而不仅仅是图片。
五、 JavaScript:改变 HTML 样式
改变 HTML 元素的样式,属于改变 HTML 属性的变种。
实例
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式
六、JavaScript:验证输入
JavaScript 常用于验证用户的输入。
实例
if isNaN(x) {alert("Not Numeric")};
更多例子,请参见W3School
参考资料:
W3School****
这里是一个广告位,,感兴趣的都可以发邮件聊聊:tiehan@sina.cn
个人公众号,比较懒,很少更新,可以在上面提问题,如果回复不及时,可发邮件给我: tiehan@sina.cn
个人公众号,比较懒,很少更新,可以在上面提问题,如果回复不及时,可发邮件给我: tiehan@sina.cn