JavaScript在HTML中的应用探讨

朱敏

【摘 要】本文介绍了JavaScript的特点和功能，给出了JavaScript脚本语言在HTML中的应用语法。用JavaScript语言可以写出各种功能的代码，使网页更具有特色和交互性。最后通过实例对JavaScript在HTML中的应用进行了探讨。

【关键词】JavaScript；HTML；动态网页

0 引言

当你使用各种各样的浏览器在WWW上漫游时，你会发现网站上的图片在不断的刷新变化，或者鼠标移到某处时字体的颜色会变，或者有那么一串文字一直跟随着你的鼠标在动等等这些有趣的事情，使我们浏览的网页变得生动活泼起来。而这些效果是如何来的呢？其实是由web上的脚本语言所控制的。目前可用的脚本语言中，最流行的就是JavaScript。它是一种基于对象和事件驱动并具有安全性能的脚本语言，可用于客户端和服务器端的编程。通过嵌入或导入到标准的HTML文档中来控制页面，并能对用户的触发事件做出响应，增强了网页的表现力和交互性。它还有一个强大的特点就是跨平台性，依赖于Web浏览器本身，与操作环境无关。需要注意的是，我们在使用JavaScript的时候，要注意浏览器的不同版本。

1 在HTML中的用法

1.1 设置脚本语言

JavaScript代码可以直接包含在标记之间放置在HTML的任何位置，既可以放在head内，也可以放在body内。具体用法如下：

其中URL处填写保存的脚本文件名即可。这种方法的优点是当你需要修改所有HTML文档中的函数定义时，对脚本库进行修改即可，这样便于实现网站的模块化设计。

1.3 通过属性调用文本

在实际应用中，经常会用到事件驱动。所以我们还可以通过某个HTML元素的事件处理程序的属性值来调用JavaScript脚本。例如对于元素，可以将其onclick属性设置为一段JavaScript代码。当用户点击的时候，浏览器将解释执行由onclick属性指定的脚本代码。

具体方法如下：

关闭窗口

该例中点击“关闭窗口”这个超链接时，执行window.close（），实现窗口的关闭。

2 应用实例

基于以上介绍的方法，我们可将JavaScript脚本程序嵌入HTML文档中实现动态网页的设计，下面就举两个日常生活中常见的例子和大家一起分享。

2.1 滚动字幕

我们经常会看见一些网页上一段移动的广告文字，看上去很有趣，实现这一动态效果的代码如下：

在浏览器窗口的标题栏中循环显示要显示的内容。

在这个例子里，我们主要通过把字符串截成两个子串，然后再右子串与左子串连接，重新组成一个完整的字符串，再通过定时器每隔0.2秒重新进行以上操作来实现字幕的滚动。

2.2 计算练习

小学生学习各种计算的时候，需要多加练习。完全靠自己手动出题很麻烦，我们可以在网页上实现动态的出题，还可以及时得出对错，这样省时省力，详细代码如下：

两位数的加法练习

在这个例子中，设计了一个表单，包含了显示题目和对错消息的两个“标签”，用于输入结果的“文本框”以及一个“确定按钮”和一个“重新出题按钮”。其中“确定”按钮用来判断文本框中的结果是否与题目的正确结果相等，并根据答题情况，在最后一个标签处给出相应消息。“重新出题”按钮用来产生两个两位数的随机整数，并把题目显示在第一个标签处。由于篇幅有限，只列举了计算两位数加法练习的代码，有兴趣的读者可以扩充为两位数的四则运算的练习。

3 结束语

JavaScript由于其简单性、动态性、跨平台性、基于对象、事件驱动等等一系列的特点，在动态网页的设计中得到了广泛的应用。它的功能非常强大，本文的介绍仅仅只是冰山一角。当大家对JavaScript相当熟悉之后，会做出非常有趣生动的网页出来。

【参考文献】

[1]于万国.用HTML+CSS+JavaScript实现滚动图片的技术[J].衡水学院学报.2015（4）.

[2]郭珂.用JavaScript脚本语言编写试题网页[J].电脑编程技巧与维护，2014（6）.

[3]吴通，陈雨亭.基于动态分析的JavaScript代码推荐[J].计算机工程，2014（10）.

[责任编辑：朱丽娜]