Javascript入门学习第七篇 js dom实例操作第2/2页
更新时间:2008年07月06日 10:02:12 作者:
上篇文章我们讲了 用dom方式 创建节点,复制节点,插入节点。
今天我们将讲 删除节点,替换节点,查找节点等。
4, 设置/获取属性节点。
setAttribute();//设置
例子:
var a = document.createElement(“p”);
a.setAttribute(“title”,”my demo”);
不管以前有没有title属性,以后的值 是 my demo。
getAttribute();//获取
例子:
var a =document.getElementById(“cssrain”);
var b = a.getAttribute(“title”);
获取的时候,如果属性不存在,则返回空,注意ie和ff返回不同。
<body>
<p title="test">aaaa</p>
<p>bbbb</p>
<script type="text/JavaScript">
var paras = document.getElementsByTagName("p");
for (var i=0; i< paras.length; i++) {
var title_text = paras[i].getAttribute("title");
if (title_text != null) {
//这样写会有个问题:ff只弹一次,ie却弹了2次。
//如果 if (title_text != "") 这样写,ie只弹1次,ff却弹出2次。
//如果这样写呢? if (title_text) ,我们发现,ie只弹1次,ff也只弹出1次。
//if (title_text) 才是我们想要的。
//注意:如果不存在 ff下返回null
//ie返回 "" ;
alert(title_text);
}
}
</script>
</body>
返回虽然不同,但是可以用一个方法来判断。
if(a.getAttribute(“title”) ){
// do something
}
5,hasChildNodes:
由名字就可以知道,是判断元素是否有子节点。
返回boolean类型。
文本节点和属性节点不可能有子节点,所以他们的hasChildNodes 永远返回false;
hasChildNodes经常跟 childNodes 一起使用。
比如:
<body>
<div id="cssrain">
<div id="a">a </div>
<div id="b">b </div>
<div id="c">c </div>
</div>
</body>
<script>
var ps = document.getElementById("cssrain")
if(ps.hasChildNodes){
alert( ps.childNodes.length );
}
</script>
大家自己动动手写写,不然光看记忆性不好。
好了,讲到这里,明天继续讲。
今天讲了 用dom方式删除节点,替换节点,查找节点, 获取属性等。。。
操作DOM的方法也差不多了。
明天我们讲DOM 属性…..
如果还有不懂,可以google 搜索资料.
相关文章
简介JavaScript中的getUTCFullYear()方法的使用
这篇文章主要介绍了简介JavaScript中的getUTCFullYear()方法的使用,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06javascript document.execCommand() 常用解析
dom下execCommand命令的一些参数整理,需要的朋友可以参考下。2009-12-12深入理解JavaScript系列(44):设计模式之桥接模式详解
这篇文章主要介绍了深入理解JavaScript系列(44):设计模式之桥接模式详解,桥接模式(Bridge)将抽象部分与它的实现部分分离,使它们都可以独立地变化,需要的朋友可以参考下2015-03-03js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件
嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下js阻止默认事件与js阻止事件冒泡示例,大家参考使用吧2014-01-01
最新评论