Web脚本语言是给Web页面增加情趣以及用心的方式与用户交互的最容易方式之一。
交互式任务需要的是:程序设计语言或者脚步编程语言。
JS就是一种使你能够把脚步编程与HTML结合起来一起创建交互式Web页面的Web脚步编程语言。
JS是一种解析语言:不需要进行编译,浏览器会执行所遇到的每一行脚步。
解析语言的优点是:编写或更改脚步非常简单。
解析语言的缺点是:不能快速执行,不适合用在复杂的工作,比如图像。此外,解析还需要解析器。
在HTML中有4个位置可以使用脚步:
- 在页面的主题内:这种情况下,当浏览器加载时,将把脚步显示为HTML文档的一部分。
- 在页面头部 head 标签内:通常放置的是函数体——可以作为单个单元使用的JS语句组。
- 在HTML标签内(如 body 或 form 内):这称为事件处理程序,它使脚本能够处理HTML元素。在事件处理程序中使用 JS 时,无需使用 script 标签。
- 完全在单独文件内:JS支持使用包含脚步的带有 .js 扩展名的文件;可以通过在 script 标签中指定一个文件来包括它们。脚步文件实际上可以具有任何文件扩展名,甚至没有。
单独使用文件:
外部 js 文件的优点:可以从两个或更多的HTML文档链接到同一个 .js 文件。由于浏览器把这个文件存储在内存中,因此可以减少显示Web页面所花事件。
javascript事件:
可以利用JavaScript做出与用户交互的事件,例如单击链接或者按钮。
<button type="button" onclick="alert('You click the button.')" >Click Me!</button>
JS的功能:
- 改进导航
- 验证表单
- 特殊效果
- 远程脚步调用AJAX
时间的脚本:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
</head>
<body>
<h1>Current Date and Time</h1>
<script type="text/javascript">
now = new Date();
localtime = now.toString();
utctime = now.toGMTString();
year = now.getYear();
month = now.getMonth();
day = now.getDay();
hours = now.getHours();
mins = now.getMinutes();
secs = now.getSeconds();
millsecs = now.getMilliseconds();
if (mins < 10) { mins = "0" + mins; }
if (secs < 10) { secs = "0" + secs; }
document.write("<p><strong>Local time:</strong>" + localtime + "</p>");
document.write("<p><strong>Utc Time:</strong>" + utctime + "</p>");
document.write("<p><strong>" + hours + ":" + mins + ":" + secs +":"+millsecs+ "</strong></p>");
now2 = new Date();
localtime = now2.toString();
utctime = now2.toGMTString();
year = now2.getYear();
month = now2.getMonth();
day = now2.getDay();
hours = now2.getHours();
mins = now2.getMinutes();
secs = now2.getSeconds();
millsecs = now2.getMilliseconds();
if (mins < 10) { mins = "0" + mins; }
if (secs < 10) { secs = "0" + secs; }
document.write("<p><strong>Local time2:</strong>" + localtime + "</p>");
document.write("<p><strong>Utc Time2:</strong>" + utctime + "</p>");
document.write("<p><strong>" + hours + ":" + mins + ":" + secs +":"+millsecs+ "</strong></p>");
</script>
</body>
</html>