Question

我有一个HTML代码段如下：

<tr><td></br></td></tr>
<tr title="title"><td></td><td>凝固検査専用容器</td></tr>
<tr id='map_6011' />
<tr id='map_6012' />
<tr id='map_6010' />
<tr id='map_6184' />
<tr id='map_6336' />    
<tr><td></br></td></tr>

<tr title="title"><td></td><td>血糖専用容器(NaF入り)</td></tr>
<tr id='map_2055' />
<tr id='map_3471' />    
<tr><td></br></td></tr>

<tr title="title"><td></td><td>ｱﾝﾓﾆｱ専用容器</td></tr>
<tr id='map_2142' />

首先，我想选择标题为“title”的每个TR标签，然后选择该特定TR标签的第一个兄弟。（即，下一个TR的ID为'map_xxxx'）。

我有这样的javascript：

var lblTRs=$("tr[title=title]");
for(var i=0;i<lblTRs.length;i++){
    var obj=lblTRs[i];
    var firstTRSibling=obj.nextSibling;
    alert(firstTRSibling); //this gives [object Text]
}

但它没有给出实际的TR兄弟.warning（）给出[object Text]。

我在这里做错了什么？

Answer 1

试试这样：

var firstTRSibling;
while((firstTRSibling=obj.nextSibling).nodeType !== 3){
                                               //   ^-----indicates TEXT_NODE
    obj=obj.nextSibling;
}
alert(firstTRSibling);

DOM元素之间有额外的空白字符，它们将被视为文本节点。

Answer 2

我认为你可以简单地使用next：

$("tr[title='title']").each(function() {
    var element = $(this).next();
});

BTW，<tr>应该有结束标记（即</tr>），并且还包含指定数量的<td></td>标记。

Answer 3

您的问题是每对<tr>元素之间的空格表示为DOM中的文本节点。然而，与表相关的元素似乎鲜为人知的属性使得处理这个很容易。特别是在这种情况下，rows元素的<table>属性和rowIndex元素的<tr>属性。假设您有一个<tr>元素存储在名为tr的变量中，您只需要：

tr.parentNode.rows[tr.rowIndex + 1];

这适用于所有主流浏览器，返回IE 4，是DOM标准的一部分。它比使用jQuery或其他库更快，更兼容。

Answer 4

好的，我应该使用

var firstTRSibling=obj.nextSibling.nextSibling;

但为什么？_

Answer 5

由于您已经在使用jQuery，我建议使用jQuery内置next函数。

可能是var lblTRs=$("tr[title=title]").next("tr");

之类的东西

访问下一个兄弟

5 个答案: