1.因为HTML标签，被浏览器进行渲染时，就会将网页中所有标签内容渲染成对象在网页中进行展示。所以每个HTML标签其实都是独立的网页文档对象，随意才能被JS进行提取、修改、删除、查询的操作
DOM-document object model： 文档对象模型：统一管理组织网页文档数据/网页标签
DOM模型数据操作
JavaScript操作网页文档对象
操作标签【增加、删除、查询】
操作属性【增加、删除、修改、查询】
操作样式【增加、删除、修改、查询】
操作内容【增加、删除、修改、查询】
docement。getElementById（）根据标签的id属性提取一个标签对象
document。getElementsByTagName（）根据标签名称，提取多个标签对象
document。getElemensByName（）根据标签的name属性提取多个标签对象
document。getElementsByClassname（）根据标签的class属性提取多个标签对象。对于IE7不兼容，目前主流浏览器都可以操作。
2、查询标签对象
查询一个指定的标签
document.getElementById()
document.getElementsByName()
document.getElementsByClassName()
document.getElementsTagName()
查询这个标签的所有字标签：
（1）获取当前标签区域内的字标签数量
var 变量名称 = 区域标签名称。childElementCount;
（2）获取当前标签区域内的文本节点
var 变量名称 = 区域标签名称。childNodes;
（3）获取当前标签区域内的所有字标签；
var 变量名称 = 区域标签名称。Children；
（4）获取当前标间区域内的所有列表（存在兼容性问题）
var 变量名称 = 区域标签名称。childList;
（5）查询第一个子标签（兼容性问题）
var 变量名称 = 当前区域标签名称。firstChild
var 变量名称 = 当前区域标签名称。firstElementChild
（6）查询最后一个子标签（兼容性问题）
var 变量名称 = 当前区域标签名称。lastChild;
var 变量名称 = 当前区域标签名称。lastElementChild;
（7）指定获取子标签中的某个标签
var 变量名称1 = 当前所选中区域标签名称。children;
var 变量名称2 = 变量名称1【0】（下标操作）
查询这个标签的父标签：
（Node.parentNode返回当前节点的父节点）
pass
查询这个标签的兄弟标签|同级标签：
var 变量名称1 = documnet.getElementById（“id属性”）
（获取它前面的同级标签）
var 变量名称2 = 变量名称1。previousSibling;
var 变量名称2 = 变量名称1.nextSibling;
// var变量名称2 1 = 变量名称1.previousElementSibling;// 兼容性问题
// var 变量名称3 =变量名称1.nextElementSibling;// 兼容性问题
var _p1 = _tt2.parent;
var _p2 = _tt2.parentElement;
var _p3 = _tt2.parentNode;
pass
/*********************查询标签********************************/
/*
Node.nodeName //返回节点名称，只读
Node.nodeType //返回节点类型的常数值，只读
Node.nodeValue //返回Text或Comment节点的文本值，只读
Node.textContent //返回当前节点和它的所有后代节点的文本内容，可读写
Node.baseURI //返回当前网页的绝对路径
Node.ownerDocument //返回当前节点所在的顶层文档对象，即document
Node.nextSibling //返回紧跟在当前节点后面的第一个兄弟节点
Node.previousSibling //返回当前节点前面的、距离最近的一个兄弟节点
Node.parentNode //返回当前节点的父节点
Node.parentElement //返回当前节点的父Element节点
Node.childNodes //返回当前节点的所有子节点
Node.firstChild //返回当前节点的第一个子节点
Node.lastChild //返回当前节点的最后一个子节点
//parentNode接口
Node.children //返回指定节点的所有Element子节点
Node.firstElementChild //返回当前节点的第一个Element子节点
Node.lastElementChild //返回当前节点的最后一个Element子节点
Node.childElementCount //返回当前节点所有Element子节点的数目。
*/
网友评论