JavaScript 引入方式
- 提问：CSS的引入方式？
- 在学习
JavaScript 语法之前，我们首先要知道在哪里写 JavaScript 才行。 - 想要在
HTML 中引入 JavaScript，一般有 3 种方式。 -
-
-
- 实际上，
JavaScript 的 3 种引入方式，跟 CSS 的 3 种引入方式（外部样式表、内部样式表、行内样式表）是非常相似的。
1.2.1. 外部 JavaScript
- 外部
JavaScript：指的是把 HTML 代码和 JavaScript 代码单独放在不同文件中，然后在 HTML 文档中使用 script 标签来引入 JavaScript 代码。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!--1、在head中引入-->
<script src="dom1.js"></script>
</head>
<body>
<!--2、在body中引入-->
<script src="dom1.js"></script>
</body>
</html>
1.2.2. 内部 JavaScript
- 内部
JavaScript，指的是把 HTML 代码和 JavaScript 代码放在同一个文件中，其中 JavaScript 代码写在<script></script>标签对内。标签可以放在网页的任何位置。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!--1、在head中引入-->
<script>
alert("123");
</script>
</head>
<body>
<!--2、在body中引入-->
<script>
alert("456");
</script>
</body>
</html>
- 同样的，内部
JavaScript 文件不仅可以在 head 中引入，也可以在 body 中引入。
- 实际上
<script></script>是一种简写形式，它其实等价于：
<script type="text/javascript">
……
</script>
1.2.3. 元素属性 JavaScript
- 元素属性
JavaScript，指的是在元素的事件属性中直接编写 JavaScript 或调用函数。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<input type="button" style="color:red" value="按钮" onclick="alert('Gok，给你初恋般的感觉')"/>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
function yyds() {
alert("Gok，给你初恋般的感觉");
}
</script>
</head>
<body>
<input type="button" value="按钮" onclick="yyds()" />
</body>
</html>
1.3. 一个简单的 JavaScript 程序
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window.onload = function () {
alert("Welcome to Big Hacker!")
}
</script>
</head>
<body>
<button onclick="location.href='https://www.4399.com/'">提交</button>
</body>
</html>
