在HTML中引入JavaScript

红太狼 2022-07-15 05:26 276阅读 0赞

本文原创地址链接：[http://blog.csdn.net/zhou\_xiao\_cheng/article/details/53027539][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>

[http_blog.csdn.net_zhou_xiao_cheng_article_details_53027539]: http://blog.csdn.net/zhou_xiao_cheng/article/details/53027539