JavaScript(入门篇)
1.发展历史
1.1诞生
在网络并不发达到状态下,急需一门可以验证客户端输入的脚本语言。于是由网景开发的脚本语言LiveScript便应运而生。而后网景与Sun(java原母公司)结为开发联盟,在Netscape Navigator 2正式发布前,网景把LiveScript改名为JavaScript。(虽然名字中有java,但它本身与Java并没有太大关联,只是毕竟有Sun公司人员参与开发,该语言上但某些语法规范与Java有相似的地方)
1.2实现
1.2.1ECMAScript
ECMAScript,即ECMA-262定义的语言,并不局限于浏览器。web浏览器只是ECMAScript实现可能存在的宿主环境。ECMAScript先后经历10个版本,目前仍在更新中。
1.2.2DOM(文档对象模型)
- 文档对象模型是一个应用编程接口,用于在HTML中使用扩展的XML。
- DOM通过创建表示表示文档的树,让开发者可以随心所欲地控制网页内容和结构。
- DOM的四个级别
1.2.3BOM(浏览器对象模型)
- 用于支持访问和操作浏览器的窗口
1.3小结
JavaScript是一门用来与网页交互的脚本语言
- ECMAScript:由ECMA-262定义并提供核心功能。
- 文档对象模型(DOM):提供与网页内容交互的方法和接口。
- 浏览器对象模型(BOM):提供与浏览器交互的方法和接口。
2.应用
2.1 < script > 元素
- 用于在HTML中引入javaScript脚本
- 八个属性
- async:异步加载脚本
- charset :字符集
- crossorigin:配置相关请求的CORS(跨源资源共享)设置。默认不使用
- defer:延迟加载脚本
- integrity:比对接收到的资源和指定的加密签名以验证子资源完整性
- language:最初用于表示代码块中的脚本语言(已废弃)
- src:表示包含要执行的代码的外部文件
- type:表示代码块中的MIME类型
2.1.1 标签位置
一般来说是可以放在HTML页面中的任意位置,但在实际使用中要考虑到加载顺序的问题,若是直接在页面中写代码的话最好是放在靠近< /body>的地方,如果是引入外部脚本的话最好是放在head中,当然也可以用window.onload让页面加载完在加载JavaScript脚本。
2.1.2 XHTML(可扩展超文本标记语言)
XHTML原本是W3C为了阻止浏览器厂商恶性竞争而从新包装的语言。但由于没有人愿意选择一种语言规范更加严格的语言,导致后来被废弃。
2.2 行内代码与外部文件
- 使用外部文件的好处
- 可维护性
- 浏览器缓存
- 向上兼容
2.3小结
- 要包含外部JavaScript文件,必须将src属性设置为要包含文件的URL。文件可以跟网页在同一台服务器上,也可以位于完全不同的域。
- 所有< script>元素会依照它们在网页中出现的次序被解释。在不使用defer和async属性的情况下,包含在< script>元素中的代码必须严格按次序解释。
- 对不推迟执行的脚本,浏览器必须解释完位于< script>元素中的代码,然后才能继续渲染页面的剩余部分。为此,通常应该把< script>元素放到页面末尾,介于主内容之后及< /body>标签之前。
- 可以使用defer属性把脚本推迟到文档渲染完毕后再执行。推迟的脚本原则上按照它们被列出的次序执行。
- 可以使用async属性表示脚本不需要等待其他脚本,同时也不阻塞文档渲染,即异步加载。异步脚本不能保证按照它们在页面中出现的次序执行。