zoukankan      html  css  js  c++  java
  • JS权威指南读书笔记(五)

    第十三章 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>
    使用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;
        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中的文档。
    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对象。 
     
  • 相关阅读:
    Golang string slice
    Golang 切片
    Golang 数组
    Golang随机数
    如何才能轻松地分析日志?
    Linux 环境下 gzip 的加解密命令
    谁掳走了 nginx.pid 文件?
    这个 'ip' 竟然把我搞蒙圈了……
    Mysql 连接路径 url 参数解析
    C# 接口生成工具Swagger用法
  • 原文地址:https://www.cnblogs.com/liutie1030/p/5723902.html
Copyright © 2011-2022 走看看