[A] : dom编程

作者: loster | 来源:发表于2018-01-24 17:44 被阅读25次

在此前面的章节都是基础章节,基础章节仅供辅导提升课外使用,不能替代现有的所有内容,将打算分为26个章节完成dom编程
当然有很多历史上的遗留问题,这部分需要自己查询,凡是标准按照MDN文档里的接口来说明。
现在市面上已经很多成型的dom编程的书籍,我这里按照的是从基本的内容解析开始,如果调用document自带的query函数,和其他的内置api。

从这一章开始,你所需要的基本了解

  1. html 是一种结构化标签,用来描述超文本,是网络资源上的一个节点,常规的html文件后缀就是html,最新的html标准是 html5
  2. javascrip是一门弱类型动态语言。window是浏览器提供的javascript顶级对象。
  3. dom编程使用javascript与html节点交互,交互方法就是调用Application Programming Interface(API)
  4. 为了统一,使用编码集为utf-8
  5. document是文档的顶级对象,代表的是整个html文档节点#document
  6. html内所有的内容都有对应的文档节点可以表示,注释也是一个文档节点
  7. 跟文档交互使用的是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 (节点)。节点也是用来描述文档的主要内容。

相关文章

  • 前端工程师之DOM编程艺术(持续更新)

    @(书籍阅读)[网易云课堂|DOM] DOM编程艺术 网易前端微专业之《DOM编程艺术》笔记,持续更新; 更新事件...

  • 《DOM编程艺术》一、DOM

    title: 《DOM编程艺术》一、DOMdate: 2017-04-13 22:27:25tags: DOM编程...

  • BFC和DOM初级认知总结

    DOM 最近看了JavaScript DOM编程艺术这本书的DOM章节,下面就总结下DOM这个章节关于DOM的知识...

  • JavaScript入门学习书籍到阶段书籍

    入门:《深入浅出JavaScript》《JavaScript DOM编程艺术》 《JavaScript DOM高级...

  • DOM编程

    文档对象模型 一个html页面被浏览器加载的时候,浏览器就会对整个html页面上的所有标签都会创建一个对应...

  • [A] : dom编程

    在此前面的章节都是基础章节,基础章节仅供辅导提升课外使用,不能替代现有的所有内容,将打算分为26个章节完成dom编...

  • DOM编程

    获取元素 元素的6层原型链 第一层原型: HTMLDivElement.prototype第二层原型: HTMLE...

  • DOM 编程

    前言 DOM(Docoment Object Model) 即文档对象模型。也就是 JS 通过 Document ...

  • DOM编程

    JS使用document操作网页这就是Document Object Model文档对象模型 div六层原型 DO...

  • DOM :DOM0 DOM1 DOM2 DOM3

    一、DOM全称文档对象模型(Document Object Model) 二、DOM是什么DOM就是一个编程接口,...

网友评论

    本文标题:[A] : dom编程

    本文链接:https://www.haomeiwen.com/subject/oybuaxtx.html