JavaScript代码怎样引入到HTML中?

yumo6664个月前 (07-09)技术文章53

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

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

2.外部形式

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

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

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

<!DOCTYPE html>
 <html>
 <head>
   <meta charset="UTF-8">
   <title>JavaScript 基础 - 引入方式</title>
 </head>
 <body>
   <!-- 外部形式:通过 script 的 src 属性引入独立的 .js 文件 -->
   <script src="demo.js">
     // 此处的代码会被忽略掉!!!!
       alert(666);  
   </script>
 </body>
 </html>

相关文章

JavaScript如何入门?(javascript怎么入门)

1, 建议阅读“javascript高级程序设计”第三版电子版。(我刚开始学习,我向表哥(软件工程师)说我想做前端,于是,他帮我买了这本书,好的书大家都会推荐,很容易在网上找到,也没有必要我说一定是这...

js基础学习(js零基础入门视频教程)

vscode运行js要在VSCode中运行JavaScript代码,你需要按照以下步骤操作:首先确保你已经安装了Node.js。如果没有安装,可以从官网(https://nodejs.org/)下载并...

javascript基础入门(javascript基础入门资料)

第1天,学习的是js最基本的东西(包括js的组成、数据类型、数据类型转换、NaN和isNaN、隐式类型转换、加减乘除以及取余、变量作用域、闭包简单的概念、命名规范、运算符和逻辑运算符、程序流程控制:...

JS入门基础知识(js基础知识总结笔记)

JS对象操作对象增删改查创建对象 let obj = {}新增属性 obj.a = 1修改属性 obj.a = 'a'查询属性 obj.a删除属性 delete obj.a其他操作ob...

程序员的 JavaScript 代码该如何让计算机搞懂?

出自程序员之手的 JavaScript 代码,该如何变成计算机所能理解的机器语言呢?本文将带你走进 JavaScript 引擎内部,一探究竟。作者 | Lydia Hallie译者 | 弯月,责编 |...

想快速学习JavaScript ,你必须先知道这几点

对于初学JavaScript ,或者其他任何一种语言。常常会遇到一些问题,比如概念可能会造成混淆 ,找不到时间(有时是动力)学习,很容易忘记已经理解了的东西,工具多又在不断变化,所以不知道从哪里开始...