[A] : dom编程
2018-01-24 本文已影响25人
loster
在此前面的章节都是基础章节,基础章节仅供辅导提升课外使用,不能替代现有的所有内容,将打算分为26个章节完成dom编程
当然有很多历史上的遗留问题,这部分需要自己查询,凡是标准按照MDN文档里的接口来说明。
现在市面上已经很多成型的dom编程的书籍,我这里按照的是从基本的内容解析开始,如果调用document自带的query函数,和其他的内置api。
从这一章开始,你所需要的基本了解
- html 是一种结构化标签,用来描述超文本,是网络资源上的一个节点,常规的html文件后缀就是html,最新的html标准是 html5
- javascrip是一门弱类型动态语言。window是浏览器提供的javascript顶级对象。
- dom编程使用javascript与html节点交互,交互方法就是调用Application Programming Interface(API)
- 为了统一,使用编码集为utf-8
- document是文档的顶级对象,代表的是整个html文档节点#document
- html内所有的内容都有对应的文档节点可以表示,注释也是一个文档节点
- 跟文档交互使用的是window.document属性,简写为document
- 创建一个文档标签节点
var div = document.createElement('div');
div.constructor.name // HTMLDivElement
// 但是不可以用 new HTMLDivElement创建一个div标签节点
new HTMLDivElement // Illegal constructor
// 如果创建的节点标签不存在,从 HTMLUnknownElement创建元素
var unknown = document.createElement('unknown');
unknown.constructor.name // HTMLUnknownElement
- 创建一个文档文本节点
var textNode = document.createTextNode('this is text');
textNode.constructor.name // Text
//实验室功能:可以用Text直接构建一个文本节点
var text = new Text("this from Text");
- 创建一个注释节点
var commentNode= document.createComment('this is Comment');
commentNode.constructor.name // Comment
//实验室功能:可以用Comment直接构建一个注释节点
var comment= new Comment("this from Comment");
- 创建一个属性节点
var attr = document.createAttribute("attr");
attr.constructor.name // Attr
//即将废弃 , Attr将不再继承Node节点
以上的节点全部继承于 Node (节点)。节点也是用来描述文档的主要内容。