JS第五课_DOM对象模型高级编程(增查)

去掉空格文本节点

function cleanWhitespaceDG(nodeObj){ 
	//经典算法:递归算法
	for(var i=nodeObj.childNodes.length-1;i>=0;i--){
		var node=nodeObj.childNodes[i];
	   //文本节点 并且 文本节点的值为空白
	  if(node.nodeType==3 && /\s/.test(node.nodeValue)){  
		node.parentNode.removeChild(node);
		continue;
	  }
	  cleanWhitespaceDG(node);
	}
}

1.找到元素

  • 根据ID
    document.getElementById("id");
  • 根据name
    document.getElementsByName("name");
  • 根据标签名称 标签tag
    document.getElementsByTagName("p");
  • 根据表单
    document.form表单name.文本框的name.value;

2.找节点

  • 本节点--自己
    var tab=document.getElemetById("tab");
  • 父节点
    tab.parentNode
  • 子节点
    tab.firstChild--第一个子节点
    tab.lastChild--最后一个子节点
    tab.childNodes--子节点的集合
    tab.childNodes[下标]--数组下标一样 0开始
    tab.childNodes.length---获取子节点的总数

3.新建元素

JS的写法
var im=document.createElement("img");
----上一句代码相当于------
JS第五课_DOM对象模型高级编程(增查)
赋值图片路径
im.src="55.gif";
HTML的写法

	<img src=""/>
定义属性注意:必须当前标签有该属性才可以设置

标签新建的时候自动识别单/双
var tab=document.createElement("table");

4.追加元素(后) -- 排队

节点对象.appendChild(新的元素);
tab.appendChild(im);


5.插入元素(前) -- 插队

本元素.父节点.插入(新元素,本元素)
tab.parentNode.insertBefore(im,tab);


JS第五课_DOM对象模型高级编程(增查)

上一篇:如何让局域网其他电脑通过IP直接访问自己电脑的网站


下一篇:php怎么把字符转成大小写,php怎么把字符串转换为大小写