首页 > web前端 > js教程 > 正文

哪些方法可以让html文档内嵌入js

php中世界最好的语言
发布: 2018-05-23 13:54:01
原创
1207 人浏览过

这次给大家带来哪些方法可以让html文档内嵌入js,html文档内嵌入js的注意事项有哪些,下面就是实战案例,一起来看一下。

在HTML里嵌入JavaScript

在HTML文档里嵌入客户端JavaScript代码有4中方法:

1.内嵌,放置在<script>和</script>标签之间  (少);

2.放置在有<script>标签的src属性指定的外部文件中  (多);</p> <p style="text-align: left;">3.放置自<a href="http://www.php.cn/code/8922.html" target="_blank">HTML事件处理程序</a>中,该事件处理程序由onclick或<a href="http://www.php.cn/wiki/1457.html" target="_blank">onmouseover</a>这样的HTML属性值指定它  (很少);</p> <p style="text-align: left;">4.放在一个URL里,这个URL使用特殊的协议”javascript“协议  (很少);</p> <p style="text-align: left;"><span style="color: #0000ff">0——附:脚本类型</span></p> <p style="text-align: left;">JavaScript是Web的原始脚本语言,在默认情况下,<script>元素包含或引用JavaScript代码。如果要使用不标准的脚本语言,如VBScript,就必须用type属性指定脚本的MIME类型,例如:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">&lt;script type=&quot;text/vbscript&quot;&gt;   ... ...  &lt;/script&gt;</pre><div class="contentsignin">登录后复制</div></div> <p style="text-align: left;"><span style="color: #ff0000">type 属性的默认值是 ”text/javascript“。</span></p> <p style="text-align: left;"><span style="color: #0000ff">1——内嵌<script>元素</span></p> <p style="text-align: left;">例如:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> &lt;script&gt;   function displayTime(){   ... ...   }   window.onload = displayTime;  &lt;/script&gt;</pre><div class="contentsignin">登录后复制</div></div> <p style="text-align: left;"><span style="color: #0000ff">2——src属性使用外部文件中的脚本</span></p> <p style="text-align: left;"><script>标签支持src属性,这个属性指定包含JavaScript代码的文件的URL。它的用法如下:</p> <p style="text-align: left;"><span style="text-decoration:underline;">复制代码</span> 代码如下:</p> <p style="text-align: left;"><script src="../../scripts/util.js"></script>

使用src属性时,<script></script>标签之间的任何内容都会被忽略。

当在页面中用src属性包含一个脚本时,就给了脚本坐着完全控制Web页面的权限。

3——HTML中的事件处理程序

当脚本所在的HTML文件被载入浏览器时,这个脚本里的JavaScript代码只会执行一次。JavaScript代码可以通过把函数赋值给Element对象的属性来注册事件处理程序。这个Element对象表示文档里的一个HTML元素。

例如:

复制代码 代码如下:

HTML中定义的事件处理程序的属性可以包含任意条JavaScript语句,相互之间用逗号分隔。这些语句组成一个函数体,然后这个函数成为对应事件处理程序属性的值。

4——URL中JavaScript

在URL后面跟着一个javascript:协议限定符,是另一种嵌入JavaScript代码到客户端的方式。这种特殊的协议类型指定URL内容为任意字符串,这个字符串是会被JavaScript解释器运行的JavaScript代码。它被当作单独的一行代码对待,这意味着语句之间必须用分号隔开,而注释必须用/**/注释代替。javascript:URL能识别的资源是转换成字符串的执行代码的返回值。如果代码返回 undefined,那么这个资源是没有内容的。

javascript:URL可以在可以使用常规URL的任意地方:比如标记的href属性,

的action属性,甚至window.open()方法的参数。

超链接里的JavaScript URL可以是这样:

<a href="javascript:new Date().toLocaleTimeString();" rel="external nofollow" > 
What time is it? 
</a>
登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

ES6中Promise使用步骤详解

怎样用React Form完成组件封装

以上是哪些方法可以让html文档内嵌入js的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!