1. 如何向网页添加JavaScript?
在HTML中,我们使用<script>
标签向页面添加JavaScript。一共有三种方法,如下:
(1)内部引入
<script type="text/javascript">
//JavaScript语句块
</script>
type属性在HTML4.01中必填,HTML5中可选,默认不写则为“text/javascript”
;
<script>
标签可以在HTML的任意位置。
(2)外部引入
如果JavaScript代码多,且逻辑较独立,可以将代码写到外部的js文件中,再用如下代码引入。
<script src="xx.js"></script>
这样有几个好处:
- 更好地实现HTML和JavaScript的分离,便于代码维护。
- js文件缓存后可以提升页面的加载速度。
(3)行间引入(内联)
早期的事件处理中,允许在内联的事件属性中执行JavaScript,比如:
<button onclick="alert(hello js!);"></button>
我们不推荐使用此种方式引入JavaScript,该方式容易导致JavaScript污染HTML(因为两种代码过于混在一起,不符合目前的软件开发主流趋势),而且效率低下不易维护,我们在后期讲DOM时再详细分析。
2. 编写第一个JavaScript程序
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个JavaScript程序</title>
</head>
<body>
<script>
console.log("Hello JavaScript!");
</script>
</body>
</html>
通过编写该程序,你可以:
- 熟悉JavaScript的代码编写
- 了解如何在浏览器调试代码,这里我们使用了
console.log()
来输出,可以在谷歌浏览器中按F12
键查看输出结果,如下:
👍,真是个好的开始!