博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript使用方法
阅读量:5240 次
发布时间:2019-06-14

本文共 3178 字,大约阅读时间需要 10 分钟。

1     <script> 标签

  <script> 标签用于定义客户端脚本,比如 JavaScript。
  在 HTML 中,JavaScript 代码必须位于 <script> 与 </script> 标签之间。
  script 元素既可以包含脚本语句,也可以通过 src 属性指向外部脚本文件。

  注:旧的 JavaScript 例子也许会使用 type 属性:<script type="text/javascript">。

         type 属性不是必需的。JavaScript 是 HTML 中的默认脚本语言。
1.1  <script> 属性  

属性 是否必填 适用范围 说明
async 可选 外部文件 表示应该立即下载脚本,但不应妨碍页面中的其它操作,比如下载资源或其它脚本文件
charset 可选 外部文件 表示通过src指定的代码的字符集
defer 可选 外部文件,IE4-7也支持嵌入代码 表示脚本可以延迟到文档完全解析和显示之后再执行
language 可选(已废弃)   原用于表示编写代码的脚本语言
src 可选,使用外部文件时为必填选项 外部文件 表示包含要执行的外部文件
type 可选,默认text/javascript   可以看成是language的替代属性,表示编写代码使用的脚本语言的内容类型(也称为MIME类型)。

  

(1)     关于type属性,虽然text/javascript和java/ecmascript都已经不被推荐使用,但一直以来使用的都还是text/javascript,实际上,服务器在传送JavaScript文件时使用的MIME类型通常是application/x-javascript,但在type中设置这个值可能导致脚本被忽略,另外,在非IE浏览器中还可以使用application/javascript和application/ecmascript。type如果没有指定,默认值为text/javascript。

(2)    只要不包含async和defer,浏览器会按照<script>在页面中出现的顺序依次解析;设置了defer时,会立即下载<script>元素,但是延迟执行,在规范中,要求多个含defer属性的脚本顺序执行且在DOMContentLoaded事件前执行,但是在实现中不一定满足这些要求;在HTML5中添加了async属性,和defer类似,也只是适用于外部文件,告诉浏览器立即下载文件,但延迟执行,不同的是,多个含async的脚本即便在规范中也没有规定执行的顺序,异步脚本再load事件前执行,但可能在DOMContentLoaded之前或之后执行。

(3)    在阅读之前的代码或者用一些IDE生成代码时,常常可以看到下面的结构:

显示 说明 实体名称 实体编号
  半方大的空白 &ensp; &#8194;
  全方大的空白 &emsp; &#8195;
  不断行的空白 &nbsp; &#160;
< 小于 &lt; &#60;
> 大于 &gt; &#62;
& &符号 &amp; &#38;
" 双引号 &quot; &#34;

  有些不支持JavaScript的浏览器,可以将JavaScript代码包含在一个HTML注释中(由于所有主流浏览器均支持JavaScript,所以不再推荐使用):  

  对于一些老旧浏览器或者禁用了JavaScript的浏览器,还可以使用<noscript></noscript>元素来呈现相关的说明。

1.2   <script> 位置

   脚本可被放置与 HTML 页面的 <body> 或 <head> 部分中,或兼而有之。

   注:把脚本置于 <body> 元素的底部,可改善显示速度,因为脚本编译会拖慢显示。

(1)   <head> 中的 JavaScript

  JavaScript 函数被放置于 HTML 页面的 <head> 部分

  例: 

一张网页

一个段落

(2)   <body> 中的 JavaScript

  JavaScript 函数被放置于 HTML 页面的 <body> 部分。

  例:  

 

A Web Page

一个段落

 

2     JavaScript 使用方法

  在HTML中使用JavaScript的方式主要有:

2.1  引入外部脚本

    在Html中使用<script>标签元素引入外部文件(推荐),将代码写入外部文件中,JavaScript 文件的文件扩展名是 .js。

  如需使用外部脚本,请在 <script> 标签的 src (source) 属性中设置脚本的名称。

  可通过完整的 URL 或相对于当前网页的路径引用外部脚本:

(1)   使用完整的 URL 来链接至脚本

  例:  

(2)  使用位于当前网站上指定文件夹中的脚本

  例:

(3)  链接了与当前页面相同文件夹的脚本:

  例:

备注:

a.    可以在 <head> 或 <body> 中放置外部脚本引用。

b.    在XHTML文档中,导入外部文件时,可以使用简写方式<script/>但是在HTML中只能<script></script>。
c.    导入外部文件时,src属性是必须的,这个时候嵌入在<script></script>中的代码(如果有)会被忽略。

d.    src属性也可以指定来自外部域的JavaScript文件,这一点让<script>元素异常强大,也备受争议,因为可能会让人恶意注入脚本。

e.    外部文件只需要包含<script></script>中的代码即可,不需要包括<script>元素本身,意思就是外部脚本不能包含 <script> 标签。

f.     外部文件一般扩展名为.js,但这不是强制的。

引入外部脚本优势:

a.    分离了 HTML 和代码

b.    使 HTML 和 JavaScript 更易于阅读和维护
c.    已缓存的 JavaScript 文件可加速页面加载

 

2.2  在<script>内写入JavaScript代码。

  在<script>元素中内嵌代码时,只需要指定type属性,但代码中不能出现</script>字符串,否则会解析出错。

  例:  

');会将字符串中的作为前面的标签结束符来解析,从而出现异常    document.writeln('');//通过将分开,从而避免作为

 

2.3  将脚本程序代码作为某个元素的事件属性值或超链接的href属性值

  超链接<a>的href属性除了可以使用http和mailto等协议之外,还可以使用Javascript协议。

  例:

  单击这个超链接,浏览器将会执行JavaScript:后面的脚本程序代码。

 

3     文档模式    

  在IE5.5中开始引入文档模式的概念,通过使用通过文档类型(doctype)切换实现的,最初包括混杂模式(quirks mode)和标准模式(standards mode),混杂模式让IE的行为与包括非标准特性的IE5相同,标准模式则让IE的行为更接近标准行为。在IE引入文档模式之后,其他浏览器也纷纷仿效。之后,IE又提出一种所谓准标准模式(almost standards mode),这种模式下的浏览器特性有很多是符合标准的,但也不尽然。所有浏览器默认开启混杂模式。

  可以通过下面的方法启动标准模式: 

 

  通过过渡性或框架集型来触发准标准模式:  

 

参考来源:

转载于:https://www.cnblogs.com/iamspecialone/p/11209305.html

你可能感兴趣的文章
知识不是来炫耀的,而是来分享的-----现在的人们却…似乎开始变味了…
查看>>
口胡:[HNOI2011]数学作业
查看>>
03 线程池
查看>>
手机验证码执行流程
查看>>
设计模式课程 设计模式精讲 2-2 UML类图讲解
查看>>
Silverlight 的菜单控件。(不是 Toolkit的)
查看>>
jquery的contains方法
查看>>
linux后台运行和关闭SSH运行,查看后台任务
查看>>
桥接模式-Bridge(Java实现)
查看>>
303. Range Sum Query - Immutable
查看>>
图片加载失败显示默认图片占位符
查看>>
【★】浅谈计算机与随机数
查看>>
解决 sublime text3 运行python文件无法input的问题
查看>>
javascript面相对象编程,封装与继承
查看>>
算法之搜索篇
查看>>
新的开始
查看>>
Leetcode 226: Invert Binary Tree
查看>>
解决miner.start() 返回null
查看>>
bzoj 2007: [Noi2010]海拔【最小割+dijskstra】
查看>>
C# Dynamic通用反序列化Json类型并遍历属性比较
查看>>