《JavaScript高级程序设计》Chapter02 <script>元素
<script>
- 现代web应用程序通常将所有JavaScript引用放在<body>元素中的页面内容后面
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
</head>
<body>
<!--页面内容-->
<script src="example1.js"></script>
<script src="example2.js"></script>
</body>
</html>
推迟执行——属性defer:浏览器立即下载并解析但延迟执行脚本,延迟到整个页面都解析完毕后再执行
- 仅对外部脚本文件有效
- HTML5规范要求他们按顺序执行(最好只包含一个这样的脚本)
异步执行——属性async:浏览器立即下载并解析脚本,之后可立即执行
- 仅对外部脚本文件有效
- 不一定会按在页面中嵌入的顺序执行
- 异步脚本不应该在加载期间修改DOM
动态加载脚本:向DOM动态添加script元素
let script = document.createElement('script');
script.src = 'hello.js';
script.async = false;
document.head.appendChild(script);
- 默认情况下以此形式创建的<script>元素为异步加载(相当于添加了async属性),但并不是所有浏览器都支持async属性;因此,可以明确其为同步加载【script.async = false;】
XHTML中的变化
XHTML编写规则更加严格
使用JavaScript必须指定type属性为"text/javascript"
html中的<script>标签内会应用特殊规则,而xhtml不会(script标签内的js中的'<'在xhtml中会被解释为一个标签的开始)
解决:将所有代码包含在一个CDATA块中
- 在不支持CDATA的非XHTML兼容浏览器中不可行——CDATA标记使用JavaScript注释来抵消
<script type="text/javascript">
//<![CDATA[
function compare(a,b){
if(a<b) console.log("a is smaller");
else if(a>b) console.log("b is smaller");
else console.log("a is equals to b"),
}
//]]>
</script>
<noscript>
- 可以包含任何可以出现在<body>中的HTML元素,<script>除外
- 当:
- 浏览器不支持脚本
- 浏览器对脚本的支持被关闭
满足其一时,<noscript>中的内容将被渲染
《JavaScript高级程序设计》Chapter02 <script>元素的更多相关文章
- 【javascript学习——《javascript高级程序设计》笔记】DOM操作
DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口).DOM描绘了一个层次节点树,允许开发人员添加.移除和修改. 1.节点层次 <html> <head& ...
- javascript高级程序设计阅读笔记(一)
javascript高级程序设计阅读笔记(一) 工作之余开发些web应用作为兴趣,在交互方面需要掌握javascript和css.HTML5等技术,因此读书笔记是必要的. javascript简介 J ...
- 《JavaScript高级程序设计》学习笔记
系统学习JS, 从<JavaScript高级程序设计>入门,通过学习jQuery或者angularJS源码来进阶. 第1章 JavaScript简介 1.JS问世的目的是处理以前由服务器端 ...
- 读书时间《JavaScript高级程序设计》一:基础篇
第一次看了<JavaScript高级程序设计>第二版,那时见到手上的书,第一感觉真是好厚的一本书啊.现在再次回顾一下,看的是<JavaScript高级程序设计>第三版,并记录一 ...
- 《JavaScript高级程序设计》 -- 基本概念(一)
之前看过好几遍<JavaScript高级程序设计>这一书,但是始终没有完完整整的看过一遍.从现在开始我会把它完整的啃一遍,每章节都记录笔记,自己的心得,加油! 由于前三章的内容比较简单,因 ...
- JavaScript高级程序设计学习(三)之变量、作用域和内存问题
这次讲的主要是变量,作用域和内存问题. 任何一门编程语言,都涉及这三个. 变量,比如全局变量,局部变量等,作用域,也分全局作用域和方法作用域,内存问题,在java中就涉及到一个垃圾回收的问题,由于ja ...
- JavaScript高级程序设计第三版.CHM【带实例】
从驱动全球商业.贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过. JavaScript 是一种非常松散的面向对象语言,也是 ...
- 《Javascript高级程序设计》阅读记录(一):第二、三章
<Javascript高级程序设计>阅读记录(一) 这个系列,我会把阅读<Javascript高级程序设计>之后,感觉讲的比较深入,而且实际使用价值较大的内容记录下来,并且注释 ...
- javascript高级程序设计学习笔记
javascript高级程序设计,当枕头书已经好久了~zz 现在觉得自己在js的开发上遇到了一些瓶颈,归根究底还是基础太薄弱,所以重新刷一遍js高程希望有更新的认识. 一.javascript简介 ...
- 《JavaScript高级程序设计》——第二章在HTML使用JavaScript
这章讲的是JavaScript在HTML中的使用,也就是<script>元素的属性.书中详细讲了async.defer.src和type四个<script>的属性. 下面是对第 ...
随机推荐
- 央行DR007在哪里查看
1.中国外汇交易中心,点击官网进入 https://www.chinamoney.com.cn/chinese/ 2.点击数据选项,接着选择货币市场行情 3.点击质押式回购
- vs code + miktex配置
windows10系统通过choco安装miktex choco install miktex 添加path vscode配置: { // Latex workshop "latex-wor ...
- 查看Windows操作系统编码方式
chcp 编码表: 代码页 国家(地区)或语言 437 美国 708 阿拉伯文(ASMO 708)720 阿拉伯文(DOS)850 多语言(拉丁文 I) 852 中欧(DOS) - 斯拉夫语(拉丁文 ...
- python logging模块学习
logging 是对程序运行中的日志进行输出记录,用户在程序中设置在哪个地方输出什么信息,方便进行之后问题的排查. logging输出有两种方式:输出至控制台 . 输出至文件 输出至控制台: impo ...
- [Github]获取github ID号
[Github]获取github ID号 https://api.github.com/users/ + 你的账户名称 实例:我github账号叫iBoundary. https://api.gith ...
- 36.Vim笔记
1.简介 $vim [filename] vim有三种操作模式,分别称为编辑模式.插入模式和命令模式 2.编辑模式 vim编辑模式的主要用途是在被编辑的文件中移动光标的位置.一旦光标移动到所要的位置, ...
- CF79D 题解
题解 传送门 你有 \(n\) 个灯泡,一开始都未点亮. 同时你有 \(l\) 个长度,分别为 \(a_1 \sim a_l\). 每次你可以选择一段连续的子序列,且长度为某个 \(a_i\),并将这 ...
- el-form不进行校验可能的原因
可能原因 el-form至少需要:model="你的数据form",:rules='你的校验规则' 的属性: 只能校验el-input,不能对原始input进行校验 (大坑).
- zabbix 使用小技巧
001.监控项指定时间执行 wd1-7h01m00 周一到周日,每天 01:00:00 执行一次 002.监控项某一段时间点每分钟执行一次 1-5,00:00-09:00 6-7,00:00-23:5 ...
- PIL画图只有黑白色
背景 项目上需要对人工标注的图片上的框进行校对,验证有无漏框.错框等问题.尝试使用opencv把框信息画出来,但是中文无法写到图片上,么得办法,只能转战PIL.但是用PIL之后出现部分图画出来的框写出 ...