这段代码取不到值

Zi_Yuan 2010-10-26 04:01:24
请教大家,我这段代码哪里有问题?为什么只能执行setpreBg函数,缺不能执行setnextBg函数?为什么第一个alert能取到值,第二个却取不到?

function setBg(obj){
var preNode=obj.parentNode.previousSibling; //tr
var nextNode=obj.parentNode.nextSibling;
//alert(nextNode.nodeName);
obj.style.backgroundImage="url(images/btnbg.gif)";
if(preNode.nodeName=="TR")
setpreBg(preNode);
//alert(nextNode.nodeName);
if(nextNode.nodeName=="TR")
setnextBg(nextNode);

}
function setpreBg(pre){
pre.childNodes[0].style.backgroundImage="";
var preNode=pre.previousSibling; //td
if(preNode.nodeName=="TR")
setpreBg(preNode);
}
function setnextBg(next){
next.childNodes[0].style.backgroundImage="";
var nextNode=next.nextSibling;
if(nextNode.nodeName=="TR")
setnextBg(nextNode);
}


<table width="103" border="0"cellspacing="1" cellpadding="0" style="margin-left:22px; margin-top:24px; font-weight: bold; font-family: '黑体'; font-size: 12px;">
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小马</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小明</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小李</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小张</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小兰</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小新</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小吴</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小环</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小小</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小青</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小白</td>
</tr>
<tr>
<td width="101" height="24" background="" class="btnbj" style="text-align: right" onclick="javascript:setBg(this);">小黑</td>
</tr>
</table>
...全文
62 6 点赞 打赏 收藏 举报
写回复
6 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
Zi_Yuan 2010-10-26
[Quote=引用 5 楼 cj205 的回复:]
我晕啊 既然上面这个没有判断。下面的同样要判断啊~

function setBg(obj){
var preNode=obj.parentNode.previousSibling; //tr
var nextNode=obj.parentNode.nextSibling;
//alert(nextNode.nodeName);
obj.style.background……
[/Quote]
这个对啦,thankU 啦
  • 打赏
  • 举报
回复
Mr-Jee 2010-10-26
我晕啊 既然上面这个没有判断。下面的同样要判断啊~

function setBg(obj){
var preNode=obj.parentNode.previousSibling; //tr
var nextNode=obj.parentNode.nextSibling;
//alert(nextNode.nodeName);
obj.style.backgroundImage="url(images/btnbg.gif)";
if(preNode || preNode.nodeName=="TR")
setpreBg(preNode);
//alert(nextNode.nodeName);
if(nextNode || nextNode.nodeName=="TR")
setnextBg(nextNode);

}
  • 打赏
  • 举报
回复
Zi_Yuan 2010-10-26
[Quote=引用 2 楼 hch126163 的回复:]
在firefox中,空白也是一个dom节点,要获取上一个节点,下一个节点的兼容写法:
//获取上一个节点
function getPreviousChild(obj) {
var result = obj.previousSibling;
while(result!=null &&!result.tagName) {
result = result.pr……
[/Quote]
现在是在IE中测试也不能完全通过
  • 打赏
  • 举报
回复
Zi_Yuan 2010-10-26
[Quote=引用 1 楼 cj205 的回复:]
var preNode=obj.parentNode.previousSibling; //tr
因为这个可能没有啊~~~
if(preNode && preNode.nodeName=="TR")
[/Quote]
还是不对,你们自己测试一下就会发现一个问题,只能执行setpreBg函数,却不能执行setnextBg函数
  • 打赏
  • 举报
回复
hch126163 2010-10-26
在firefox中,空白也是一个dom节点,要获取上一个节点,下一个节点的兼容写法:
//获取上一个节点
function getPreviousChild(obj) {
var result = obj.previousSibling;
while(result!=null &&!result.tagName) {
result = result.previousSibling;
}
return result;
};
//获取下一个节点
function getNextChild(obj) {
var result = obj.nextSibling;
while (result!=null &&!result.tagName) {
result = result.nextSibling;
}
return result;
};

当然你还可以修改此函数,添加节点的标签名称,判断是什么节点
  • 打赏
  • 举报
回复
Mr-Jee 2010-10-26
var preNode=obj.parentNode.previousSibling; //tr
因为这个可能没有啊~~~
if(preNode && preNode.nodeName=="TR")
  • 打赏
  • 举报
回复
相关推荐
发帖
JavaScript
加入

8.5w+

社区成员

Web 开发 JavaScript
申请成为版主
帖子事件
创建了帖子
2010-10-26 04:01
社区公告
暂无公告