CY-Left

JavaScript开发语言

Dom对象概述-JavaScript

一、Dom对象节点

  1. 节点类型如下

元素类型|节点类型
— |—
元素节点| 1
属性节点| 2
文本节点| 3
注释节点| 8
文档节点| 9

  1. 节点属性
  • nodeName(节点名称)
  • nodeValue(节点值)
  • nodeType(节点类型)

(一) 元素节点

例子:

<td id="idName" name="name">text</td>

document.getElementById("idName");

nodeType:1

nodeName:TD

nodeValue:null

(二) 属性节点

例子:

<td id="idName" name="name">text</td>

document.getElementById("idName").getAttributeNode("name");     

nodeType值:2

nodeName:name

nodeValue:myname

(三) 文本节点

<td id="idName" name="name">text</td>

document.getElementById("idName").firstChild       

nodeType值:3

nodeName:#text

nodeValue:text

二、节点操作

(一) 插入节点

  1. 在指定节点的最后一个子节点列表之后添加一个新的子节点(末位)

var parent = document.getElementById("A"); var newNode = document.createElement("li"); // 以下两句等同于 newNode.innerText = "js"; var neTtext= document.createTextNode("js"); newNode.appendChild(newText); parent.appendChild(newnode);
  1. 在指定节点之前插入一个节点
  var parent = document.getElementById("A");

  var newNode = document.createElement("li");

  newNode.innerHTML = "js";

  parent.insertBefore(newNode,parent.childNodes[1]); 

(二) 删除节点

删除指定子节点

var parent = document.getElementById(A);

parent.removeChild(content.childNodes[0]);

(三) 替换节点

替换指定子节点

var oldNode=document.getElementById("A");

var newNode=document.createElement("i");

newNode.innerHTML=oldNode.innerHTML

oldNode.parentNode.replaceChild(newNode,oldNode);
  1. document.innerHtml
  2. document.innerText
  3. document.style.attribute = ‘#ccc’
  4. document.className = “Class One”

本文虽拙,却也系作者劳动,转载还请保留本文链接: http://cyleft.com/?p=272



Have any Question or Comment?

发表评论

电子邮件地址不会被公开。 必填项已用*标注