JavaScript代码写在哪里?
2025-07-02 06:40:44
在网页中编写JavaScript代码时,有3种书写位置,分别是行内式、内嵌式(也称为嵌人式)和外部式(也称为外链式),下面分别进行讲解。
1.行内式
行内式是指将单行或少量的JavaScript代码写在HTML标签的事件属性中(也就是以on开头的属性,如onclick)。下面通过具体操作步骤进行演示。
(1)创建一个简单的HTML页面,将文件命名为demo01.html。
(2)编写demo01.html,具体代码如下。
在上述代码中,第4行声明了网页的编码为UTF-8,帮助浏览器正确识别网页的编码。
在声明编码后,还需要确保文件本身的编码也是UTF-8。目前大多数代码编辑器新建的文件编码默认都是UTF-8。另外,Windows 记事本默认的编码是ANSI,在记事本中编写的网页容易出现乱码,因此读者应杜绝使用记事本编写代码文件。
(3)使用行内式编写JavaScript代码,实现单击一个按钮后, 弹出一一个警告框,显示一些提示信息,具体代码如下。
在上述代码中,写在onclick属性里的代码就是JavaScript代码。
(4)通过浏览器访问demo01.html,运行结果如下图所示。
以上步骤演示了行内式的使用。在实际开发中,使用行内式还需要注意以下4点。
①注意单引号和双引号的使用。在HTML中推荐使用双引号,而JavaScript推荐使用单引号。
②行内式可读性较差,尤其是在HTML中编写大量JavaScript代码时,不方便阅读。
③在遇到多层引号嵌套的情况时,非常容易混淆,导致代码出错。
④只有临时测试,或者特殊情况下再使用行内式,一般情况下不推荐使用行内式。
2.内嵌式(嵌入式)
内嵌式是指使用
在上述代码中,第4行是一条JavaScript语句,其末尾的分号“;” 表示该语句结束,后面可以编写下一条语句。
(2)创建test.js文件,在文件中编写JavaScript代码,如下所示。
alert('外部式');
(3)通过浏览器访问demo03.html,页面一打开后,就会自动弹出一个警告框,提示信息为“外部式”。
猜你喜欢:
Javascript创建数组的方式
JavaScript执行机制详细介绍
JavaScript数据类型:javascript数据类型有哪些?
Javascript多维数组介绍
黑马程序员HTML&JS+前端培训课程