moon javaScript简介 第1章和 在HTML中使用javaScript第2章

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了moon javaScript简介 第1章和 在HTML中使用javaScript第2章相关的知识,希望对你有一定的参考价值。

  javascript基础知识

     javaScript 是脚本语言

           是一种轻量级的编程语言。

           是可插入 html 页面的编程代码。

           插入 HTML 页面后,可由所有的现代浏览器执行。

             javaScript由3个不同的不封组成:核心(ECMAScript)

                                                      文档对象模型(DOM)

                                                      浏览器对象模型(BOM)

            1.1  ECMAScript:定义了JavaScript基础。web浏览器只是ECMAScript实现的宿主环境之一(宿主环境)

                              组成部分:a 语法  b 类型  c 语句 d 关键字 e 保留字 f 操作符 g 对象

                               ECMA:    European Computer Manufacturers Association 欧洲计算机制造商协会

                               ECMAScript协议标准由39号技术委员会制定(TC39,Technical Committee#39)

             1.2 DOM  :     Document Object Model 是针对XML但经过拓展用于HTML的应用程序接口(API,Application Programming Interface)

                            DOM把整个页面映射为一个多层次节点结构,HTML或XML页面中的每个组成部分都是某种类型的节点,这些节点都包含某种

                            不同类型的数据。

                            W3C(World Wide Web Consortium,万维网联盟:负责制定通信 标准)着手规划DOM

                             DOM的级别: DOM1由两模块组成 a,DOM核心(DOM Core) 和 DOM HTML

                                                             DOM核心:映射基于XML的文档结构,以便简化对文档的任意部分访问和操作
                                                            DOM HTML模块则在DOM核心基础上加以拓展,添加正对HTML的对象和想法

                 DOM2: 在DOM1基础上引入 DOM试图(DOM Views):定义了跟踪不同文档试图的接口。

                                                                                         DOM 事件(DOM Events):定义了事件和事件处理的接口。

                                                                                         DOM样式(DOM Traversal and Range):

                                       定义了遍历和操作树的接口。

                 DOM3:在DOM2的基础之上        DOM加载和保存(DOM Load and Save):引入以统一方式加载和保存文档的方式接口

                                                                                         DOM验证(DOM Validation):定义了验证文档方法的接口

                                  对DOM核心的拓展

     1.3BOM: Browser Object Model。支持可以访问和操作浏览器窗口浏览器对象模型(其中window对象和navigator对象)

                 从根本上讲,BOM只处理浏览器与窗口和框架,惯常也讲所有针对浏览器的JavaScript拓展算作BOM的一部分(如下)  

                                  弹出浏览器窗口的功能

                                  移动、缩放、和关闭浏览器窗口的功能

                                  提供浏览器详细信息的Navigator对象

                                  提供浏览器所加载页面的详细信息的location对象

                                  提供用户显示器分辨率详细信息的screen对象

                                  对cookies的支持

                                  像XMLHttpRequest和IE的ActiveXObject这样的自定义对象的支持

 

 

------------------------------------------------------------------------------

 在HTML中使用JavaScript

     本章主要内容:<script>元素(重点)

            嵌入代码与外部文件

            文档模式

          2.1<script>元素

               属性:

                   async:可选属性,表示应该立即下载脚本,但不妨碍页面中的其它操作,比如下载其他资源或等待加载其他脚本

                              注意,只对外部脚本文件有用

                   charset:可选属性,表示通过src属性指定的代码字符集。大多数浏览器会忽略这个属性值。故这一属性基本不用

                   defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行

                               注意,只对外部脚本文件有效

                   src: 可选。表示包含要执行代码的外部文件

                          外部的 JavaScript

                            也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。

                            外部 JavaScript 文件的文件扩展名是 .js。

                            如需使用外部文件,请在 <script> 标签的 "src" 属性中设置该 .js 文件:

                               外部脚本不能包含 <script> 标签。【见于W3C学习网站】

                    type:可选,表示编写代码使用脚本语言的内容类型(也称为MIME类型)。实际上服务器在传送javaScript

                            文件是使用的MIME类型通常是application/x-javascript,在type设置这一值

                            application/x-javascript脚本会忽略,type的值用的最多的是

                            text/javascript,这一值不是必须的许多浏览器默认值就是text/javascript

        使用<script>元素的方式有两种:直接在页面中嵌入JavaScript代码

                           包含外部JavaScript文件

        21.1.1<script>标签的位置:

             传统做法,所有<script>元素放在<head>元素中, 

             目的:把所有外部文件(包括CSS和JavaScript文件)的引用都放在相同的地方

             在文档<head>元素中包含的javascript文件意味着:必须等到全部JavaScript代码被下载、

             解析  、和执行完成之后,才能呈现页面内容(浏览器遇到<body>标签时才开始呈现内容)对于那些需要很多JavaScript

             代码的页面导致呈现页面出现明显延迟(延迟期间浏览器窗口是一片空白)

             故 现代Web应用程序讲全部JavaScript引用放在<body>元素中页面内容的后面【在解析JS代码

             之前,页面内容将呈现在浏览器中。用户会因浏览器窗口的空白页面缩短而感到打开页面的速度加快】

             注意 在<script>元素内部不要出现</script>这表示结束标签 会报错。如需用到需要使用转义字符“\”

             例子 :alert{“<\/script>”} 

             如<script>元素中包含外部文件 src属性是必须的 外部文件会加载到当前页面当中

             注意:<script type="text/javascript" src="example.js"/> 不符合HTML

             规范  不能正确解析

             外部的JavaScript文件带有.js拓展名。但不是必须的、

             带有src属性的<script>元素不应该在<script></script>之间再包含JavaScript代码,若包含

             嵌入的代码会忽略,只会执行外部脚本文件

             src属性可以是指向HTML页面所在域外的某个域中完整的URL,

              <script type=“text/javascript” 

               src="http://www/somewhere.com/afile/js"><script>

              位于外部域中的代码会被加载和解析,像这些代码位于加载它们的页面中一样、利用这一点可以在必要时通过不同域来提供JavaScript

              文件,不过可要小心,要么你是域的所有者,要么那个域的所有者值的信赖

            浏览器会按照<script>元素在页面中的出现的先后顺序对他们进行依次解析{只要不存在 defer 和async}即第一个

            <script>解析完成后,第二个<script>才会被解析,然后第3个,第4个

        21.2延迟脚本

            <script>标签的defer属性:表明脚本在执行时,不会影响页面的构造即脚本会被延迟到整个页面都解析完毕

            后再运行    defer属性相当告诉浏览器立即下载,但延迟执行

            理想状态: 多个延迟脚本时 按照他们出现的先后顺序执行,即第一个延迟脚本优先于第二个延迟脚本执行,而这两个

                  延迟脚本会优先于DOMContentLoaded事件,

            现实情况: 多个延迟脚本的执行不是顺序执行也不一定会在DOMContentLoaded事件触发钱执行

                  故最好只包含一个延迟脚本

             注意 defer属性只适用于外部脚本文件, HTML5明确规定

        21.3异步脚本

            async属性与延迟脚本类似 并告诉浏览器立即下载文件,

            不同点: async的脚本并不保证按照指定它们的先后顺序执行、故脚本之间要互不依赖非常重要

            使用async目的:不让页面等待两个脚本下载和执行,从而异步加载页面其他内容。故建议几步脚本不要在加载期间修改DOM

            异步脚本一定会在页面的load事件之前执行,当可能会在DOMContentLoad事件触发之前或之后执行

            注意也只用于 外部文件

        21.4 在XHTML中的用法(作者建议不用读,因为现前端开发人员采用HTML5标准)

 2.2嵌入代码和外部文件

                      在HTML页面中最好的做法是使用外部文件来包含JavaScript代码、  有以下优点

                             可维护性  将所有JavaScript文件放在一个文件夹可以便于维护,也有利于开发人员在不触发HTML标记情况下,

                                        集中精力编辑JavaScript代码

                             可缓存   浏览器根据具体的设置缓存链接的所有外部JavaScript文件即如果两个页面同时使用同一个文件,那么

                                        该文件只需下载一次,故加快页面的加载速度

                            适应未来 通过外部文件夹包含JavaScript无需使用前面提到的XHTML和注解hack、

2.3文档模式     

                     通过文档类型(doctype)切换实现的  最初有  混杂模式(quirks mode)和标准模式(standard mode) 模式的不同主要影响
        CSS内容的呈现,有时也会影响JavaScript的解释执行

        无申明的情况下,默认的是混杂模式

2.4<nonscript>   

         用于在不支持JavaScript的浏览器中显示替代内容, 1.浏览器不支持脚本  2.浏览器支持,但禁用   在启用了

         脚本的情况下浏览器不会解析 <nonscript>中的任何内容

以上是关于moon javaScript简介 第1章和 在HTML中使用javaScript第2章的主要内容,如果未能解决你的问题,请参考以下文章

moon Spring -- java Web 高级编程

Michael Hartl的Rails教程第11章和第12章:多个错误和邮件未被发送

《控制系统设计指南》第一章和第二章读书笔记

moon UML

UNIX网络编程-第一部分(简介)-笔录

使用ZeroTier组建异地虚拟局域网