一、在HTML代码中的 head 或 body 标签中使用 script 标签来书写JavaScript代码

样式：

<script type="text/javascript">

..............  //JavaScript代码块

</script>

注意：

  1. 可以有多个script标签
  2. 整体代码按由上至下的顺序执行

示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>方式一</title>
    <script type="text/javascript">
        // alert()是JavaScript语言提供的一个警告框函数。
        //它可以接收任意类型的参数，并且作为警告框的提示信息
        alert("hello JavaScript 第一次")
    </script>
</head>
<body>
<script type="text/javascript">
    alert("hello JavaScript 第二次")
</script>
</body>
</html>

二、使用script标签引入单独的JavaScript代码文件

样式：

<script type="text/javascript" src="JavaScript文件路径（绝对或相对路径）"></script>

注意：

  1. src的值是需要引入JavaScript文件的绝对路径或相对路径
  2. 当使用了script引入JavaScript文件后，该script标签内的代码将不再生效
  3. 如需添加JavaScript代码，则只需再定义一个script标签。两种方式均可再使用
  4. 整体代码按从上至下的顺序执行

示例：

//JavaScript文件（hello.js），放于HTML文件同级目录
alert("hello JavaScript")
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>方式二</title>
    <!-- src的值可以是JavaScript文件的绝对路径也可以是相对路径 -->
    <script type="text/javascript" src="hello.js">
        //当script标签已经引入了JavaScript文件后，script标签中的JavaScript代码将不再运行
        //如需要再添加JavaScript代码，只需再定义一个script标签。再引入文件或书写代码即可。
        //值得注意的是，代码运行顺序是从上至下
        alert("无效")
    </script>
</head>
<body>

</body>
</html>

# html # 前端 # javascript
Logo
华为云开发者联盟

为开发者提供学习成长、分享交流、生态实践、资源工具等服务，帮助开发者快速成长。

更多推荐

cover

共探AI大模型时代下的挑战与机遇，华为云HCDE与大模型专家面对面

avatar 华为云开发者联盟
cover

软件开发中，如何为你的代码构建三层防护体系

avatar 华为云开发者联盟
cover

一文回顾华为云开发者联盟精彩干货，赋能开发者智能化升级

avatar 华为云开发者联盟