DOM

来源:互联网 发布:evutec手机壳知乎 编辑:程序博客网 时间:2024/06/05 06:39
*节点
    每一个HTML标签都是一个元素节点
    标签中的文字则是文本节点
    标签中的属性则是属性节点
DOM方法:
*getElementById()
    寻找一个有着给定id属性值的元素,返回值是一个有着给定id属性值的元素节点。如果元素不存在返回null;
    var oElement = document.getElementById(sId);
    该方法只用于document对象
*getElementsByName()
    寻找一个有着给定name属性的所有元素,这个方法将返回一个节点集合,这个集合可以当做一个数组来处理。这个节点的length属性等于当前文档里有着给定name属性的所有元素的总个数。
*getElementsByTagName()
    寻找有着给定标签名的所有元素,这个方法将返回一个节点集合,这个集合可以当做一个数组来处理。这个节点的length属性等于当前文档里有着给定标签名的所有元素的总个数。
    该方法不必非得用在document文档上,它也可以用来在摸个特定元素的子节点当中寻找有着给定标签名的元素。
*getAttributeNode()  获得属性名为XX的属性节点
*hasChildNodes()
    该方法用来检查一个元素是否有子节点,返回值为true或FALSE。
    var booleanValue = element.hasChildNodes();
    文本节点和属性节点不可能包含子节点,返回值永远为FALSE;
    如果返回值为FALSE,则childNodes,firstChild,lastChild将是空数组或空字符串。
DOM属性:文档里的每个节点都含有一下属性。
*nodeName:返回一个字符串,其内容是给定节点的名字。(他是一个只读属性)
        var name = node.nodeName;
        如果节点是一个元素节点,nodeName返回这个元素的名称
        如果节点是一个属性节点,nodeName返回这个属性的名称
        如果节点是一个文本节点,nodeName返回一个内容为#text的字符串
*nodeType:返回一个整数,这个数值代表给定节点的类型。(他是一个只读属性)
        返回的整数值对应12中节点类型,常用的有三种:
        Node.ELEMENT_NODE   -----1  -----元素节点
        Node.ATTRIBUTE_NODE -----2  -----属性节点
        Node.TEXT_NODE     ------3  -----文本节点
*nodeValue:返回给节点的当前值(字符串)
        如果给定节点是一个属性节点,返回值是这个属性的值;
        如果给定节点是一个文本节点,返回值是这个文本节点的内容;
        如果给定节点是一个属性节点,返回值是null;
        nodeValue是一个读/写属性,但不能对元素节点的nodeValue属性设置值,但可以为文本节点的nodeValue属性设置值
        var li = document.getElementById("li");
        if(li.firstChild.nodeType == 3)
                li.firstChild.nodeValue = "初学前台,多多指教";
*替换节点 replaceChild()
        把一个给定父元素里的子节点替换为另一个子节点
        var reference = element.replaceChild(newChild,oldChild);
        返回值是一个指向已被替换了的那个子节点的引用指针。
        如果被插入的子节点还有子节点,则那些子节点也被插入的目标节点中。
*查找属性节点 getAttribute()
    返回一个给定元素的一个给定属性节点的值
    var attributeValue = element.getAttribute(attributeName);
    给定属性的名字必须以字符串的方式传递给该方法。
    给定属性的值将以字符串的形式返回,如果给定属性不存在,getAttribute()将返回一个空字符串。
    通过属性获取属性节点getAttributeNode(属性的名称)--Node
*设定属性节点 setAttribute()
    将给定元素节点添加一个新的属性值或改变他现有属性的值
    var attributeValue = element.setAttribute(attributeName,attributeValue);
    属性的名字和值必须以字符串的方式传递给该方法。
    如果这个属性已存在,他的值将被刷新
    如果不存在,setAttribute()方法将先创建它再为其赋值。
*创建新元素节点 creatElement()
    按照给定的标签名创建一个新的元素节点。方法只有一个参数:将被创建的元素的名字,是一个字符串。
    var reference = document.createElement(element);
    方法的返回值:是一个指向新建节点的引用指针。返回值是一个元素节点。所以他的nodeType属性值为1。
    新元素节点不会直接添加到文档中,新节点没有nodeParent属性,它只是一个存在于javascript上下文的对象。
    var pElement = document. creatElement("p");
*创建新文本节点 creatTextNode()
    创建一个包含给定文本的新文本节点,该方法返回值是一个指向新建文本节点引用指针。
    var textNode = document. creatTextNode(text);
    方法只有一个参数:新建文本节点多包含的文本字符串。
    方法的返回值:是一个指向新建节点的引用指针。返回值是一个文本节点。所以他的nodeType属性值为3。
    新元素节点不会直接添加到文档中,新节点没有nodeParent属性,
*插入节点(1) appendChild()
    为给定元素增加一个子节点:var newreference = element.appendChild(newChild);
    给定子节点newChild将成为给定元素节点element的最后一个子节点,
    方法的返回值是一个指向新增子节点的引用指针
    该方法通常与 creatElement()与creatTextNode()方法配合使用
    新节点可以被追加给文档中的任意一个元素
0 0
原创粉丝点击