首页 web前端 前端问答 html怎么加入js

html怎么加入js

Jun 21, 2021 pm 12:04 PM
html javascript

html中加入js的方法:1、在页面中直接嵌入JavaScript代码,语法“<script>js代码</script>”;2、将js代码写入“.js”文件中,使用“<script src="js文件"></script>”语句引用。

html怎么加入js

本教程操作环境:windows7系统、HTML5&&javascript1.8.5版、Dell G3电脑。

在HTML中引入JavaScript主要有两种方法,这两种方法都需要使用到<script>标签。:

方法1:在页面中直接嵌入JavaScript代码

&lt;html&gt;
&lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;ie=edge&quot;&gt;
    &lt;title&gt;JavaScript的引入&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;script&gt;
        var a=1;
        alert(a);    
    &lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
登录后复制

方法2:引入外部文件

可以通过<script>标签的src属性引入外部js文件。

虽然<script>标签还有这许多其他属性,但是这些属性都不常用,或者都有着默认值,而这些默认值通常都无需更改,所以src属性可能是你唯一需要了解的属性。

&lt;html&gt;
&lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;ie=edge&quot;&gt;
    &lt;title&gt;JavaScript的引入&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;!-- 引入本地文件 --&gt;
    &lt;script src=&quot;./script.js&quot;&gt;&lt;/script&gt;
    &lt;!-- 引入外部域的文件 --&gt;
    &lt;script src=&quot;https://cdn.jsdelivr.net/npm/vue/dist/vue.js&quot;&gt;&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
登录后复制

这种方式服务器将会以MIME类型为application/x-javascript将JavaScript文件传送到浏览器。

推荐教程:《html视频教程

以上是html怎么加入js的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

HTML 中的嵌套表 HTML 中的嵌套表 Sep 04, 2024 pm 04:49 PM

HTML 中的嵌套表

HTML 中的表格边框 HTML 中的表格边框 Sep 04, 2024 pm 04:49 PM

HTML 中的表格边框

HTML 左边距 HTML 左边距 Sep 04, 2024 pm 04:48 PM

HTML 左边距

HTML 表格布局 HTML 表格布局 Sep 04, 2024 pm 04:54 PM

HTML 表格布局

在 HTML 中移动文本 在 HTML 中移动文本 Sep 04, 2024 pm 04:45 PM

在 HTML 中移动文本

HTML 有序列表 HTML 有序列表 Sep 04, 2024 pm 04:43 PM

HTML 有序列表

您如何在PHP中解析和处理HTML/XML? 您如何在PHP中解析和处理HTML/XML? Feb 07, 2025 am 11:57 AM

您如何在PHP中解析和处理HTML/XML?

HTML onclick 按钮 HTML onclick 按钮 Sep 04, 2024 pm 04:49 PM

HTML onclick 按钮

See all articles