从头认识js-HTML中使用JavaScript
<script>元素
在HTML页面中插入Javascript的主要办法就是使用<script>元素,HTML4.01为<script>定义了下列6个属性。
1.async:可选,表示应该立即下载脚本,但不应该妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。最对外部脚本文件有效。
2.charset:可选,表示通过src属性指定的代码的字符集。由于大多数浏览器会忽略它的值,因此这个属性很少人用。
3.defer:可选,表示脚本可以延迟到文档完全被解析和显示之后在执行。只对外部脚本文件有效。IE及更早版本对嵌入脚本也支持这个属性。
4.language: 已废弃。原来用于表示编写代码使用的脚本语言。大多数浏览器会忽略这个属性,因此也没有在使用的必要了。
5.src:可选,表示包含要执行外部文件。
6.type:可选,可以看成是language的替代属性;表示编写代码使用的脚本语言的内容类型。
标签的位置
按照传统的做法,所有<script>元素都应该放在页面的<head>元素中,但是这样子文档就必须等到所有的JavaScript代码下载,解析和执行完成以后,才能开始呈现页面的内容。对于那些所有很多的JavaScript代码的页面来说,这无疑会导致浏览器在呈现页面的时候出现明显的延迟,而延迟期间的浏览器窗口中将会是一片空白,导致用户体验极其不好。为了解决这个问题,现在Web应用程序一般都把全部JavaScript引用放在<body>元素中页面内容的后面,这样在解析包含的JavaScript代码之前,页面的内容将完全呈现在浏览器中。而用户也会因为浏览器窗口显示空白页面的时间缩短而感到打开页面的速度加快了。
延迟脚本
<script>标签定义了defer属性。这个属性的用途是表明脚本在执行是不会影响页面的构造。也就是说,脚本会延迟到整个页面都解析完成之后在运行。因此,在<script>元素中设置defer属性,相当于告诉浏览器立即下载,但延迟执行。前面提到过,defer属性只适用于外部脚本文件。这一点在HTMl5已经明确规定,因此支持HTML5的实现会忽略给嵌入脚本设置的defer属性。IE4-IE7还支持对嵌入脚本的defer,像平常一样处理脚本。为此,把延迟脚本放到页面底部依然是最佳选择。
异步脚本
HTML5为<script>元素定义了async属性。与defer类似,都用于改变处理脚本的行为,也只适用于外部脚本,并告诉浏览器立即下载文件。但于defer不同的是,标记为async的脚本并不保证按指定它们的先后顺序执行。指定async属性的目的是不然页面等待拥有该属性的脚本下载和执行,从而异步加载页面其他内容。为此,建议异步脚本不要在加载期间修改DOM。异步脚本一定会在页面的load事件前执行。支持异步脚本的浏览器有Firefox3.6,Safari5和Chrome。
<noscript>元素
早期浏览器都面临一个特殊的问题,即当浏览器不支持JavaScript时如何让页面平稳退化。对于这个问题的最终解决方案就是创造一个<noscript>元素,用以不支持JavaScript的浏览器显示替代的内容。在<noscript>元素中的内容只有在下列情况才会显示出来:
1.浏览器不支持脚本
2.浏览器支持脚本,但脚本禁用。
从头认识js-HTML中使用JavaScript的更多相关文章
- JS高程2.在HTML中使用Javascript(1)
1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...
- 第2章 两种调用JS的方法——在HTML中使用JavaScript
一. <script>标记 第一种方法是把 <sript></script>直接放到head和script两个标记之间(title下面,</head>上 ...
- maven中Rhino classes (js.jar) not found - Javascript disabled的处理
想使用单元测试 来测一下服务请求,于是想到了使用Junit,查了一下,决定使用 HttpUnit 来发送请求 于是在maven中引入了 <dependency> <groupId&g ...
- jQuery-vsdoc.js文件是vs中的JavaScript intellisense,
在VS 2008中启用jQuery Intellisense的步骤 要在VS中启用jQuery的intellisense完成,你要遵循三个步骤: 第一步: 安装VS 2008 SP1 VS 2008 ...
- JavaScript进阶(二)在一个JS文件中引用另一个JS文件
在一个JS文件中引用另一个JS文件 转载地址:http://blog.csdn.net/zndxlxm/article/details/7875787 方法一 在调用文件的顶部加入下例代码 ...
- 在SharePoint解决方案中使用JavaScript (1) – 引用.js文件
本文是系列文章的第一篇. 在SharePoint解决方案中使用JavaScript (0) 作为在SharePoint应用程序中使用JavaScript的第一步,就是要知道如何将一个写好的.js文件, ...
- 全面解析JavaScript的Backbone.js框架中的Router路由
这篇文章主要介绍了Backbone.js框架中的Router路由功能,Router在Backbone中相当于一个MVC框架中的Controller控制器功能,需要的朋友可以参考下. Backbone ...
- javascript 在js文件中获取路径
如果在*.js文件中获取当自己当前的路径是很重要的. 举个例子,如果一个css文件中引用图片,如background-img: url('./Images/bg.png').那么图片的路径,是相对于c ...
- js文件中函数前加分号和感叹号是什么意思?
本文转自:http://blog.csdn.net/h_o_w_e/article/details/51388500 !function(){}(); !有什么用? 从语法上来开,JavaScri ...
随机推荐
- 迅为IMX6Q开发板提供原理图_底板PCB_驱动程序源码_芯片和LCD数据手册_开发板环境_使用手册
迅为IMX6开发板: Android4.4/6.0系统 Linux + Qt5.7系统 Ubuntu12.04系统 部分案例:HMI:3D打印机:医疗设备:工控机:触控一体机:车载终端 核心板 ...
- Qt 信息提示框 QMessageBox
information QMessageBox::information(NULL, "Title","Content",QMessageBox::Yes | ...
- Flask的Jinja2模版过滤器
Jinja2模版过滤器 过滤器是通过管道符号(|)进行使用的,例如:{{ name|length }},将返回name的长度.过滤器相当于是一个函数,把当前的变量传入到过滤器中,然后过滤器根据自己的功 ...
- Qt .pro文件详解
在我们创建Qt工程项目时,Qt Creator总会创建一个.pro文件,我们称.pro文件为Qt的工程管理文件.一个工程项目可以包含一个或多个.pro文件.理解和掌握pro文件的用法,将有利于Qt开发 ...
- 关于(int argc char **argv)
演示使用opencv显示一幅图片: #include <iostream> #include <core/core.hpp> #include <highgui/high ...
- 安装VSCODE和typora黑屏
工欲善其事必先利其器,本来是为了学git为了保存代码,然后网上一顿搜索研究之后发现,用git来保存笔记也不错,因为现在用的onenote搜索实在在在在是太不方便了,除了搜索不行,其他方面她还是很好的, ...
- 吴裕雄--天生自然python学习笔记:编写网络爬虫代码获取指定网站的图片
我们经常会在网上搜索井下载图片,然而一张一张地下载就太麻烦了,本案例 就是通过网络爬虫技术, 一次性下载该网站所有的图片并保存 . 网站图片下载并保存 将指定网站的 .jpg 和 .png 格式的图片 ...
- webstrom IDE 正则替换
ide:webstrom 其他IDE,可以自行测试. 目的. 将excel的table两列(一般是中文名,英文名,改为Javascript 对象) 从 场所内网IP地址 IP_ADDRESS 源外网I ...
- telnet不是内部或外部命令的问题解决
在windows DOS 命令窗口中输入telnet命令,出现如下提示信息: 可能是没有安装telnet客户端的原因,又得开始捣鼓了 www.2cto.com 依次点击"开 ...
- mvn相关介绍和命令
1.前言 Maven,发音是[`meivin],"专家"的意思.它是一个很好的项目管理工具,很早就进入了我的必备工具行列,但是这次为了把project1项目完全迁移并应用maven ...