0

我有一个如下的 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>アンモニア専用容器&lt;/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 兄弟。alert() 给出 [object Text]。

我在这里做错了什么?

4

5 回答 5

4

试试这样:

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

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

于 2012-07-09T08:09:12.000 回答
1

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

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

这适用于 IE 4 之前的所有主要浏览器,并且是 DOM 标准的一部分。它也比使用 jQuery 或其他库更快、更兼容。

于 2012-07-09T08:22:25.690 回答
1

我认为您可以简单地使用next

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

顺便说一句,<tr>应该有结束标签(即</tr>),并在<td></td>里面包含指定数量的标签。

于 2012-07-09T08:13:39.490 回答
0

好的,我应该使用

var firstTRSibling=obj.nextSibling.nextSibling;

但为什么?_

于 2012-07-09T08:08:30.583 回答
0

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

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

于 2012-07-09T08:14:29.173 回答