本文已参与 「新人创作礼」活动, 一起开启掘金创作之路。
01- 什么是 JavaScript
- 是一门用来网页交互的脚本语言包含以下三个部分
- ECMAScript: 由 ECMA-262(ES6) 定义并提供核心功能.
- 文档对象模型(DOM): 提供与网页交互的方法和接口
- 浏览器对象模型(BOM): 提供与浏览器交互的方法和接口
- 五大 Web 浏览器(IE、Firefox(火狐)、Chrome(谷歌)、Safari(苹果) 和 Opera(欧鹏))
- ECMAScript 有必要解释一下: 是一种由Ecma国际(前身为欧洲计算机制造商协会,European Computer Manufacturers Association)通过ECMA-262标准化的脚本程序设计语言。这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,所以它可以理解为是JavaScript的一个标准,但实际上后两者是ECMA-262标准的实现和扩展。
02- HTML 中的 JavaScript
- 其中保守争议的就是 src="" 属性, 它可以使一个完整的 URL, 而且这个 URL 指向的资源乐意跟它包含的 HTML 页面不在同一个域中, 比如: 浏览器在解析这个资源时会向指定的路径发送一个 get 请求以取得相应的资源, 如果是 js 文件。这个初始的请求不受浏览器同源策略限制,但返回并被执行的 JavaScript 则受限制。当然,这个请求仍然受父页面 HTTP/HTTPS 协议的限制。来自外部域的代码会被当做加载它页面的一部分来执行这个能力可以让我们通过不同的域分发 JavaScript。不过,引用了放在别人服务器上的 JavaScript 文件时要格外小心,因为恶意的程序员随时可能替换这个文件。integrity 属性是防范的一种武器。
- 其中的 defer 属性在 HTML 4.01 中出现是为了解决浏览器渲染; 当时的 script 标签是书写在 head 标签中的, 这就导致了浏览器会先解析 js 脚本, 从而浏览器窗口在此时段都是空白显示的, 导致用户体验不佳, 所以 defer 就出现了, 它会使 js 脚本延迟到整个页面解析完毕之后再执行.相当于让浏览器立即下载延迟执行. 属性书写: defer="defer"
- 行内代码和外部文件: 外部文件: 可维护性 js 代码分山于很多 HTML 页面, 导致维护困难, 如果使用区于 HTML 文件的独立文件更容易维护; 缓存: 浏览器会根据特定的设置缓存所有外部链接 js 文件, 意味着两个页面用到同一个 js 文件, 而只需要加载一次那么就意味着页面加载更快; 适应未来: 把 js 文件放到外部文件当中不必考虑用 XHTML 两个语法是一样的。
- 元素的出现: 早期浏览器不支持 js 的问题, 需要一个优雅降级的处理方案最终解释它的出现 元素可以包含任意可以出现在 中的 HTML 元素,标签之前。c: 可以使用 defer 属性把脚本推迟到文档渲染完毕后再执行。推迟的脚本原则上按照它们被列出的次序执行。d: 可以使用 async 属性表示脚本不需要等待其他脚本,同时也不阻塞文档渲染,即异步加载。异步脚本不能保证按照它们在页面中出现的次序执行。e: 通过使用元素,可以指定在浏览器不支持脚本时显示的内容。如果浏览器支持并启用脚本,则元素中的任何内容都不会被渲染。