在页面中嵌入JavaScript代码
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript的引入</title>
</head>
<body>
<script>
var a=1;
alert(a);
</script>
</body>
</html>引入外部文件
可以通过<script>标签的src属性引入外部js文件。
虽然<script>标签还有这许多其他属性，但是这些属性都不常用，或者都有着默认值，而这些默认值通常都无需更改，所以src属性可能是你唯一需要了解的属性。
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript的引入</title>
</head>
<body>
<!-- 引入本地文件 -->
<script src="./script.js"></script>
<!-- 引入外部域的文件 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</body>
</html>这种方式服务器将会以MIME类型为application/x-javascript将JavaScript文件传送到浏览器。
JavaScript脚本的执行顺序以及作用域
被引入的JavaScript脚本将按照<script>标签的顺序逐个执行，并且它们共享一个全局作用域。
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript的引入</title>
</head>
<body>
<script>
var a=1;
function sayHello(){
alert("hello");
}
alert(b);//控制台会报错，因为此时b尚未声明
</script>
<script>
//可以成功地使用变量a和函数sayHello()尽管它们定义在不同地script中
//但运行时它们时共享同一个作用域地
alert(a);
sayHello();
var b=2;//此时声明地变量b在前面是无法使用的，因为JavaScript是按照script便签的顺序逐行执行
</script>
</body>
</html>弄清楚作用域问题很重要，因为这个问题在长期一来都是困扰前端开发的重大问题，想象一下：当页面使用了不同的开发人员写的脚本时谁能保证代码中没有重名的变量和函数呢？由于它们共享一个作用域重名的变量将会相互覆盖这将导致一场灾难。
<script>标签的位置
<script>标签不仅可以在<body>中也可以出现在<head>中：
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript的引入</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
</body>
</html><script>标签出现在哪并无规定，但是你要记住，页面渲染的时候时按照<script>标签出现的顺序执行的，也就是说如果<script>标签如果出现在<body>的前面，那么浏览器只有当将所有的<script>便签下载并执行完毕才会渲染<body>元素中的文档内容。
以上就是html怎么引入javascript？的详细内容，更多请关注易知道|edz.cc其它相关文章！
