第十三章 Web浏览器中的JavaScript
1 在Html文档中嵌入客户端4种JS代码方法
a 内联方式,放置在<script>标签之间
b 放置在<script>标签 src 属性指定的外部文件中
c 放置在HTML事件处理程序中
d 放置在URL中,"javascript:" 协议
2 在XHTML中,script标签中内容将被当做其他内容,如果JS代码包含了"<" 或 "&"字符,那么这些字符将被解释成为XML标记。因此,如果要使用XHTML,最好把JS放在一个CDATA部分里:
<script><![CDATA[ js code ]]></script>
3 使用src属性时,script标签之间的任何内容都会忽略。
4 对于内联脚本,指定不能识别的脚本类型,不会尝试显示或执行。对于外联脚本,指定不能识别的脚本类型,那这个脚本会被忽略,并且不会从指定的URL中下载任何内容。
5 script标签可以有defer 和 async属性,如果同时具有两个属性,支持两者的浏览器会遵从async 属性而忽略 defer 属性。
注意,延迟的脚本会按照它们在文档中出现的顺序执行,而异步脚本在它们载入后执行,意味着它们可能无序执行。
6 JS程序执行的时间线:
a 创建Document对象,并开始解析Web页面,添加Element、Text节点到文档中。此时,document.readystate属性的值是 "loading" 。
b 当解析器遇到无async或defer属性script标签时,它把这些元素添加到文档中,然后执行行内或外部脚本。脚本同步执行,并且在脚本下载和执行时,解析器会暂停。这样,脚本可以用document.write() 来把文本插入到输入流中。解析器恢复时,这些文本会成为文档的一部分。同步脚本可以看到它自己的script元素和它们之前的文档内容。
c 当解析器遇到async属性script标签时,它开始下载脚本文本,并解析文档。脚本会在他下载完成后尽快执行,但是解析器没有停下来等它下载。禁止使用document.write(),可以看到自己的script 元素和它之前的所有文档元素,并且可能或干脆不可能访问其他的文档内容。
d 当文档完成解析,document.readyState属性变成 "interactive"。
e 所有有defer属性的脚本,会按照它们在文档里的出现顺序执行。异步脚本可能也会在这个时间执行。延迟脚本能访问整的文档树,禁止使用document.write() 方法。
f 浏览器在Document对象上触发 DOMContentLoaded 事件。这标志着程序执行从同步脚本执行转换到了异步事件驱动阶段。但要注意,这时可能还有异步脚本没有执行完成。
g 当所有其他内容(图片等)载入完成,并且所有异步脚本完成载入和执行,document.readyState 属性改变为 "complete",Web浏览器触发Window对象上的load事件。
h 从此刻起,会调用异步事件,以异步响应用户输入、网络事件、计时器过期等。
7 Web浏览器是Web应用的操作系统,但是Web是一个存在各种差异的环境。(不同的操作系统,不同的浏览器开发商)
8 处理兼容性的方法
a 类库(jQuery等)
b 分级浏览器支持
c 功能测试(if (element.addEventListener) 检测是否支持addEventListener)
d 怪异模式(IE4、5)和标准模式 document.compatMode("CSS1Compat BackCompat")
e 浏览器测试(navigator.userAgent)
9 JS 可访问性的一条重要原则是,设计的代码即使在禁用JS解释器的浏览器中也能正常使用。
10 同源策略:脚本只能读取和所属文档来源相同的窗口和文档的属性,应用于XMLHttpRequest是只允许生成的HTTP请求脚本所属文档的服务器。文档的来源包括协议、主机,以及载入文档的端口。
11 不严格的同源策略
a 使用多个子域情况下,设置Document对象的domain属性一样,就不再受同源策略约束;
b 跨域资源共享(Cross-Origin Resource Sharing),利用新的"Origin" 请求头,和新的"Access-Control-Allow-Origin" 响应头来扩展HTTP;
c 跨文档消息,调用Window对象上的postMessage() 方法,同时监听onmessage事件进行处理。
12 安全性
a 跨站脚本(Cross site scripting)XSS,攻击者向目标Web站点注入HTML标签和脚本。防御:在使用任何不可信的数据来动态创建文档内容之前,要从中移除HTML标签;
b 拒绝服务攻击,访问一个恶意站点,这个站点可能用无限循环或无意义的计算大量占用CPU;
c CSRF( Cross Site Request Forgery ),跨站请求伪造,防御:对于任何重要的请求都需要重新验证用户的身份,或者创建一个唯一的令牌(Token),将其存在服务端的session中及客户端的cookie中,对任何请求,都检查二者是否一致。
第十四章 Window对象
1 由于历史原因,setTimeout和setInterval的第一个参数可以作为字符串传入,指定时间之后,相当于执行eval() 。
2 Document对象有一个URL属性,是文档首次载入(决定不同的document)后保存该文档的URL静态字符串。如果定位到文档中的片段标示符,location对象会做相应的更新,而document.URL属性却不会变。
3 Location对象的toString() 方法返回location.href 属性的值。
4 Location对象的assign() 方法可以使窗口载入并显示你指定的URL中的文档。
5 History对象
a back() 后退
b forward() 前进
c go 接收一个整数参数,可以在历史列表中向前或向后跳过任意多个页。
6 Navigator重要属性
a appName:Web浏览器的全称
b appVersion: 此属性通常以数字开始,并跟着包含浏览器厂商和版本信息的详细信息
c userAgent:浏览器在它的USERAGENTHTTP头部中发送的字符串。
d platform:在其上运行浏览器的操作系统的字符串。
e onLine:表示浏览器当前是否连接到网络。
f geolocation:用于确定用户地理位置信息的接口。
7 Window对象的onerror属性是一个事件处理程序,当未捕获的异常传播到调用栈上时触发。
8 Window对象的open方法返回代表新创建的窗口的Window对象,而且这个新窗口具有opener属性,该苏醒可以打开它的原始窗口。
9 窗体可以用parent属性引用包含它的窗口或窗体的Window对象。
10 iframe元素有contentWindow属性,引用该窗体的Window对象。
- JS权威指南读书笔记(七)
第十七章 事件处理 1 客户端JS程序采用了异步事件驱动编程模型. 2 关于事件的重要定义 a 事件类型(event type) b 事件目标(event target) target ...
- JS权威指南读书笔记(六)
第十五章 脚本化文档 1 文档对象模型(DOM)是表示和操作HTML和XML文档内容的基础API. 2 文档节点的部分层次结构 Text和CDATASection都是characterData的子 ...
- JS权威指南读书笔记(二)
第四章 表达式和运算符 1 new调用构造函数的过程 a 创建一个新的空对象 b 设置空对象的_proto_指向构造函数原型prototype c 将这个新对象当做this的值 ...
- JS权威指南读书笔记(三)
第七章 数组 1 数组的实现是经过优化的,用数字索引来访问数组元素一般来说比访问常规的对象属性要快的多. 2 数组直接量的语法允许有可选的结尾的逗号,故[ ; ; ]只有两个元素而非三个. 3 调用构 ...
- JS权威指南读书笔记(一)
第一章 JavaScript概述 1 JS是一门高端的.动态的.弱类型的编程语言,非常适合面向对象和函数式的编程风格. 第二章 词法结构 1 JS程序是用Unicode字符集编写的. 2 JS是区 ...
- JS权威指南读书笔记(四)
第十章 正则表达式 1 正则表达式直接量定义为包含在一对斜杠(/)之间的字符 a /s$/ == new RegExp("s$") 2 直接量字符:所有字母和数字都是按照字 ...
- HTTP权威指南读书笔记
HTTP权威指南笔记 读书有两种境界,第一种境界是将书读薄,另一种是读厚.本篇文章就是HTTP权威指南的读书笔记,算是读书的第一重境界,将厚书读薄.文章对HTTP的一些关键概念做了比较详细的概述,通读 ...
- css权威指南读书笔记
今天翻手机,翻到了许久之前看css权威指南时的笔记,遂移到博客中来. 1.属性选择器p.one class名为one的p元素p[class][name] 含有class和name属性的p元素p[cla ...
- 经典的性能优化最佳实践 web性能权威指南 读书笔记
web性能权威指南 page 203 经典的性能优化最佳实践 无论什么网络,也不管所用网络协议是什么版本,所有应用都应该致力于消除或减 少不必要的网络延迟,将需要传输的数据压缩至最少.这两条标准是经典 ...
随机推荐
- skywalking安装运行(docker)
https://github.com/apache/skywalking-docker/tree/master/6/6.5 https://hub.docker.com/r/apache/skywal ...
- Nginx简单配置几个基于端口的虚拟主机
nginx.conf中,一个server段对应一个虚拟主机,如果要增加多个虚拟主机,增加多个server段即可. server { listen ; access_log logs/.log; loc ...
- Python执行时间的计算方法
# CPU的执行时间start = time.clock()#end = time.clock()print(end-start) # 程序执行时间:start = datetime.datetime ...
- Android中Activity的启动模式(LaunchMode)和使用场景
一.为什么需要启动模式在Android开发中,我们都知道,在默认的情况下,如果我们启动的是同一个Activity的话,系统会创建多个实例并把它们一一放入任务栈中.当我们点击返回(back)键,这些Ac ...
- JetBrainsIDEA-structure结构继承的图标说明
图标3表示重写继承类中方法 图标2表示实现继承类抽象方法或接口中的方法 图标1表示未使用继承类中的方法 类中方法并非只统计显示继承类或实现接口中方法,而是对该类中所有方法进行分类,有可能某些方法是继承 ...
- 使用yarn代替npm作为node.js的模块管理器
使用yarn代替npm作为node.js的模块管理器 转 https://www.jianshu.com/p/bfe96f89da0e Fast, reliable, and secure d ...
- ubuntu 18.04屏幕共享 -------(转载) ( Windows远程登录Ubuntu )
原文地址: https://my.oschina.net/michaelshu/blog/3018932 ----------------------------------------------- ...
- Ubuntu下root账户无法使用xshell远程连接解决方法
以前使用xshell连接服务器跑程序都很顺利,但这次整了一个root账户,发现居然连不上.百度一下,发现ubuntu系统本身是拒绝root账户远程连接的. 解决办法:参考点击传送门
- Grafana修改背景色
grafana默认主题色是黑底白字,我们将它修改成白底黑字: in /etc/grafana/grafana.ini uncomment line and set default_theme = li ...
- [LeetCode] 802. Find Eventual Safe States 找到最终的安全状态
In a directed graph, we start at some node and every turn, walk along a directed edge of the graph. ...