javascript引入方式

你这个小猪

已于 2022-04-04 16:12:17 修改

阅读量7.1k

点赞数 1

分类专栏： javaSE 前端HTML Java 文章标签： javascript

于 2022-04-03 21:57:51 首次发布

本文链接：https://blog.csdn.net/weixin_62180080/article/details/123945537

版权

Java 同时被 3 个专栏收录

6 篇文章 0 订阅

订阅专栏

前端HTML

4 篇文章 0 订阅

订阅专栏

javaSE

3 篇文章 0 订阅

订阅专栏

本文详细介绍了JavaScript的两种引入方式：内部脚本和外部脚本。内部脚本是将JS代码直接写在HTML页面中，而外部脚本则是将JavaScript代码保存为单独的.js文件再引入到HTML中。外部脚本可以提高代码的可维护性和页面加载效率。在实际应用中，推荐将脚本置于HTML body底部以优化用户体验。

摘要由CSDN通过智能技术生成

2，JavaScript引入方式

JavaScript 引入方式就是 HTML 和 JavaScript 的结合方式。JavaScript引入方式有两种：

内部脚本：将 JS代码定义在HTML页面中
外部脚本：将 JS代码定义在外部 JS文件中，然后引入到 HTML页面中

2.1 内部脚本

在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间

代码如下：

alert(数据) 是 JavaScript 的一个方法，作用是将参数数据以浏览器弹框的形式输出出来。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script>
    alert("hello js1");
</script>
</body>
</html>

从结果可以看到 js 代码已经执行了。

==提示：==
在 HTML 文档中可以在任意地方，放置任意数量的<script>标签。如下图
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        alert("hello js1");
    </script>
</head>
<body>

<script>
    alert("hello js1");
</script>

</body>
</html>
<script>
    alert("hello js1");
</script>
一般把脚本置于 <body> 元素的底部，可改善显示速度

因为浏览器在加载页面的时候会从上往下进行加载并解析。我们应该让用户看到页面内容，然后再展示动态的效果。

2.2 外部脚本

第一步：定义外部 js 文件。如定义名为 demo.js的文件

demo.js 文件内容如下：

alert("hello js");

第二步：在页面中引入外部的js文件

在页面使用 script 标签中使用 src 属性指定 js 文件的 URL 路径。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script src="../js/demo.js"></script>
</body>
</html>