JavaScript 简介
- JavaScript 是一种可以给网页增加交互性的编程语言。
- 熟悉 JavaScript 的好方法是“站在其他程序员肩膀上”,即Web 上有大量 JavaScript 代码,复制一下并稍作修改,就可以供自己使用。
- JavaScript 脚本语言,在 HTML 页面内容是包围在 <script> 标签中,不用使用 type=”text/javascript”属性。JavaScript 是所有现代浏览器以及 HTML5 中默认的脚本语言。
- JavaScript 与 Java 无关,市场营销。
- JavaScript 的微软版本称为 JScript,ASP 中可以使用 JScript 脚本语言。
Hello, World
老习惯,我们第一个 JavaScript 是向浏览器窗口输出“Hello, World!”,脚本代码(HelloWorld.html)如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Hello, World!</title> <script> function SayHello(){ document.getElementById("myMessage").innerHTML = "Hello, World!"; } </script> </head> <body> <script> document.write("<h1>我们的第一个 JavaScript 程序</h1>"); document.write("<p id="myMessage">哦, 试试下面的按钮...</p>"); </script> <button type="button" onClick="SayHello()">尝试一下</button> </body> </html>
Firefox 40.0.2 输出效果如下图:
点击“尝试一下”按钮后,<p> 标签的内容发生了变化,如下图:
我们看到了 document.getElementById(),这个方法是 HTML DOM 中定义的。
DOM(Document Object Model)文档对象模型,是用于访问 HTML 元素的正式 W3C 标准。
JavaScript 的局限性
- 不允许写服务器上的文件。
- 不能关闭不是由它自己打开的窗口。
- 不能从来自另外一个服务器的已经打开的页面中读取信息。
使用外部脚本
也可以把脚本保存在外部文件中。外部文件通常包含被多个网页使用的代码,会使站点更容易维护。
外部 JavaScript 文件的扩展名是 .js。
如果需要使用外部文件,请在 <script> 标签中使用 “src”属性中设置,如下:
<!doctype html> <html> <head> <script src="myScript.js"></script> </head> <body> </body> </html>
在这个外部脚本演示程序中,script_001.html 中引用了外部文件 script_001.js。
script_001.html
<!doctype html> <html> <head> <meta charset="utf-8"> <title>外部脚本的使用</title> <script src="script_001.js"></script> </head> <body> <h1 id="helloMessage"></h1> </body> </html>
script_001.js
// JavaScript Document window.onload = writeMessage; function writeMessage(){ document.getElementById("helloMessage").innerHTML = "Hello, World!"; }
windows.onload 是一个事件处理程序,意思是当窗口完成加载时,运行 writeMessage 函数。