javascript|javascript 高级程序设计(1-2章)
第一章:javascript简介
本章内容:
- javascript历史回顾
- javascript是什么
- javascript与ECMAScript的关系
- javascript的不同版本
文章图片
javascript 关于ECMAScript ECMA - 欧洲计算机制造协会
它规定了这门语言下列组成部分:
- 语法
- 类型
- 语句
- 关键字
- 保留字
- 操作符
- 对象
然后由不同的浏览器对其进行实现,最后我们输写遵守语法规则的程序,完成应用开发需求。
关于DOM 文档对象模型(DOM, Document Object Model)是针对XML但经过扩展用于html的应用程序编程接口。
DOM1级 主要目标:映射文档的结构。
根据DOM的定义(HTML和XML应用程序接口)可知DOM由两个部分组成,针对于XML的DOM即DOM Core和针对HTML的DOM HTML。
那DOM Core 和DOM HTML有什么区别与联系呢?
DOM Core的核心概念就是节点(Node)。DOM会将文档中不同类型的元素(这里元素并不特指这种tag,还包括属性,注释,文本之类)都看作为不同的节点。
文章图片
节点结构图 上图描述了DOM CORE的结构图,比较专业,来看一个简单的:
hello world
来看一下这段代码在标准浏览器里的DOM表现:
文章图片
DOM树 div和span元素被展现成了一个元素节点,对应到节点结构图中的Element元素
"hello world"和div与span之间的间隔,被展现成了文本节点,对应到节点结构图中的CharacterDate元素
DOM CORE在解析文档时,会将所有的元素、属性、文本、注释等等视为一个节点对象(或继承自节点对象的对象,多态、向上转型),根据文本结构依次展现,最后行成了一棵"DOM树"
DOM HTML的核心概念是HTMLElement,DOM HTML会将文档中的元素(这里的元素特指这种tag,不包括注释,属性,文本)都视为HTMLElement。而元素的属性,则为HTMLElement的属性
再来看一个示例:
从Node接口提供的属性
myElement.attributes["id"].value; 很明显myElement.attributes["id"]返回一个对象.value是得到对象的value属性
Element实现的方法返回
myElement.getAttributes("id"); 很明显此时id现在只是一个属性而已,这只是一个得到属性的操作。
其实上DOM Core和DOM html的外部调用接口相差并不是很大,对于html文档可以用DOM html进行操作,针对xhtml可以用DOM Core。
DOM2级 DOM2引入了新模块,也给出了众多新类型和新接口的定义。
- DOM视图(DOM Views): 定义了跟踪不同文档(例如:应用css之前和之后的文档)视图的接口;
- DOM事件(DOM Events):定义了事件和事件处理的接口;
- DOM样式(DOM Style): 定义了基于CSS为元素应用样式的接口;
- DOM遍历和范围(DOM Traversal and Range): 定义了遍历和操作文档树的接口;
关于BOM 可以访问和操作浏览器窗口的浏览器对象模型(BOM, Browser Object Model)
文章图片
BOM BOM与浏览器紧密结合,这些对象也被称为是宿主对象,即由环境提供的对象。
下面是一些这样的扩展:
- 弹出新窗口的功能;
- 移动、缩放、关闭浏览器窗口的功能;
- 提供浏览器详细信息的navigator对象;
- 提供浏览器所加载页面的详细信息的location对象;
- 提供用户显示器分辨率的screen对象;
- 对cookie的支持;
- 像XMLHttpRequest和IE的ActiveXObject这样的自定义对象
小结:
javascript是一种专门为网页交互而设计的脚本语言,由以下三个部分组成:
- ECMAScript,由ECMA-262定义,提供了核心语言功能;
- 文档对象模型(DOM),提供访问和操作网页内容的方法和借口;
- 浏览器对象模型(BOM),提供与浏览器交互的方法和借口;
理解Javascript_03_javascript全局观
第二章:在html中使用javascript 本章内容:
- 使用script元素
- 嵌入脚本与外部脚本
- 文档模式对javascript的影响
- 考虑禁用javascript的场景
- 内联:放置在之间;
- 放置在
async
只适用于外部脚本文件,并告诉浏览器立即下载文件,但与defer
不同的是,async
的脚本并不保证按照指定的他们的先后顺序来执行。
小结:
【javascript|javascript 高级程序设计(1-2章)】把javascript插入html页面中使用元素。使用这个可以把javascript嵌入到html页面中,让脚本与标记混合在一起。也可以包含外部的javascript文件。而我们需要注意的有:
- 在包含外部的javascript,必须将src属性制定为相应的URL。而这个文件可以是同一个服务器的文件,也可以是其他域中的文件。
- 所有的元素都会按照他们在页面中出现的先后顺序依次解析。在不使用
async
的情况下,只有在解析前面的元素的代码之后,才能解析后面的代码。 - 使用
async
属性可以表示当前脚本不必等待其他脚本,也不必阻塞文档呈现。不能保证异步脚本按照他们在页面中出现的顺序执行。
推荐阅读
- 事件代理
- 数组常用方法一
- 唐嫣可真会穿,西装搭牛仔裤都能穿出高级感,一双大长腿太抢镜
- 鹿鸣高级营养老师徐老师分享应该注意的6种食物
- Java基础-高级特性-枚举实现状态机
- HTTP高级(Cookie,Session|HTTP高级(Cookie,Session ,LocalStorage )
- 程序员|【高级Java架构师系统学习】毕业一年萌新的Java大厂面经,最新整理
- Kotlin泛型的高级特性(六)
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- Swift高级应用|Swift高级应用 -01