4
<tr>
    <th scope="row">
        <span id="home_location_indicator">(Home)</span>
    </th>
    <td>
        <span class="postal_code_display">...</span>
    </td>
    <td><input value="1" name="location_select" type="radio" /></td>
</tr>

说,我有一个<table>包含一对<tr>像上面那样的。在 中<tr>,只有一个有<span id="home_location_indicator">(Home)</span>

我正在尝试确定检索属于包含的输入的方法。name="location_select"<tr><span id="home_location_indicator">

以下是我能想到的两种方法:

  1. $("tr").has("#home_location_indicator").find('input[name="location_select"]').val()
  2. $("#home_location_indicator").parents("tr").find('input[name="location_select"]').val()

哪个是更好的方法?为什么?或者它甚至重要吗?

4

2 回答 2

2

您的第二种方法要好得多,因为它会缩小从 ID 开始的遍历范围并从那里遍历。请参见下文,对您所拥有的内容进行少量修改,

编辑:使用.closest优于.parents->证明

$("#home_location_indicator")
     .closest("tr")
     .find(':radio[name="location_select"]').val()

.has("#home_location_indicator")您的第一种方法中没有多大意义,因为您正在寻找一个 ID。如果您想获得一个 ID,请使用$('#IDSelector')最快的选择器,因为在内部它会使用document.getElementByID('IDSelector').

于 2012-04-10T19:10:22.957 回答
2

最好的方法是使用.closest()而不是.parents(),因为一旦找到匹配项,它将停止遍历。

$("#home_location_indicator") // ID, very fast
     .closest("tr") // Upwards traversal, fast, stops at tr
     .find(':radio[name="location_select"]').val() // Find, slow-ish

这比自上而下的方法要好得多:

$("tr") // getElementsByTagName, very fast
    .has("#home_location_indicator") // traverse EVERY tr ALL the way down, very slow!
    .find('input[name="location_select"]').val() // Find, slow-ish
于 2012-04-10T19:12:52.610 回答