打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
JavaScript代码具体是怎么引入到HTML中的?
userphoto

2023.05.09 湖南

关注

JavaScript 程序不能独立运行,它需要被嵌入 HTML 中,然后浏览器才能执行 JavaScript 代码。通过 <script> 标签将 JavaScript 代码引入到 HTML 中,有两种方式:
1.内部方式
内部方式是通过<script>标签包裹JavaScript代码,从而引入HTML页面中,示例代码如下:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>JavaScript 基础 - 引入方式</title>
  6. </head>
  7. <body>
  8. <!-- 内联形式:通过 script 标签包裹 JavaScript 代码 -->
  9. <script>
  10. alert('嗨,欢迎来传智播学习前端技术!')
  11. </script>
  12. </body>
  13. </html>

2.外部形式

一般将 JavaScript 代码写在独立的以 .js 结尾的文件中,然后通过 <script>标签的 <src>属性引入,示例代码如下:

  1. // demo.js
  2. document.write('嗨,欢迎来传智播学习前端技术!')
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>JavaScript 基础 - 引入方式</title>
  6. </head>
  7. <body>
  8. <!-- 外部形式:通过 script 的 src 属性引入独立的 .js 文件 -->
  9. <script src="demo.js"></script>
  10. </body>
  11. </html>

注意:如果 script 标签使用 src 属性引入了某 .js 文件,那么 标签的代码会被忽略!!!如下代码所示:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>JavaScript 基础 - 引入方式</title>
  6. </head>
  7. <body>
  8. <!-- 外部形式:通过 script 的 src 属性引入独立的 .js 文件 -->
  9. <script src="demo.js">
  10. // 此处的代码会被忽略掉!!!!
  11. alert(666);
  12. </script>
  13. </body>
  14. </html>
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
简单透彻理解JSONP原理及使用
<script>元素
高亮显示代码syntaxhighlighter
DWR 入門與應用(二)
理解dojo.require机制
让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服