在HTML中引入JavaScript

最新推荐文章于 2024-06-10 20:53:57 发布

zhou_xiao_cheng

最新推荐文章于 2024-06-10 20:53:57 发布

阅读量1.3k

点赞数

分类专栏： HTML JavaScript 文章标签： html javascript

本文链接：https://blog.csdn.net/zhou_xiao_cheng/article/details/53027539

版权

JavaScript 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

HTML

1 篇文章 0 订阅

订阅专栏

本文原创地址链接：http://blog.csdn.net/zhou_xiao_cheng/article/details/53027539，未经博主允许不得转载。
首先，明确一点：JavaScript脚本需要引入到HTML文档中，才能被浏览器所解析。
在HTML中引入JavaScript的方法，标准(这是规范，虽然不按标准也能引入==)的一共有四种：

内联式。语法：在<head>或<body>标签下，书写<script>标签，然后在<script>里写JavaScript脚本。
一般在写模板或者进行学习的时候常常使用这种方式。
```
<script>
    //JS代码...
</script>
```
由<script>标签中的src属性引入外部的JavaScript脚本文件。语法：在<head>或<body>标签下，书写<script>标签，再通过<script>的src属性引入外部的JavaScript脚本文件。src指定了包含JavaScript脚本文件的URL(路径)。
这种方法与内联式本质上是相同的，只是写法不同。
现在使用得最广泛的引入方式，优点是：使得HTML与JavaScript相分离，即内容与行为相分离，使得代码易于管理及维护；JavaScript在浏览器中只需要加载一次，如果有多个页面均使用同相同的JavaScript，那第一个页面加载完成后，剩下的页面在浏览器缓存中就能读取到…
```
<script src="../scripts/javascript.js">
</script>
```

放置在HTML的事件处理程序中(例如：onclick 、onchange等)。

<div onclick={console.log('HelloWorld')}>
</div>

或

<div onclick="console.log('HelloWorld')">
</div>

放在一个使用javascript:协议的URL中。语法：在任何可以使用普通URL的地方，都可以使用这种javascript: + JavaScript代码的方式引入JavaScript脚本。
这种引入方法早期用的比较多，现在已经很少有人用了。javascript:URL的强大用法在于：浏览器的标签，有兴趣的可以查阅资料了解。
```
<a href="javascript:console.log('HelloWorld')" >Click here</a>
```