javascript - 使用 jQuery 查找元素的最快方法

Question

给定以下 html:

<tr>
        <td>Content</td>
        <td>Content</td>
        <td>Content</td>
        <td><img id="imgProductPurchased" runat="server" visible="true" alt="Product Purchased" title="Product Purchased" src="/sitecore/shell/Themes/Standard/Applications/16x16/checkbox.png" /></td>
        <td>
            <asp:PlaceHolder ID="plhPurchased" runat="server">
                <span class="roundButton roundButtonLarge"><a id="hypPurchased" class="registryPurchased" href="#" title="Mark product as purchased" runat="server"><span>
                <em class="registryPurchased"></em>Purchased</span></a> <span class="buttonEndLarge">
                </span></span>
            </asp:PlaceHolder>
        </td>
    </tr>
            <tr>
                    Repeats above
            </tr>

我在“hypPurchased”上有一个点击事件。当该事件触发时，我需要访问该行的 plhPurchased 元素和“imgProductPurchased”元素。

编辑:

我应该说明这是使用 ASP.NET 构建的，因此，ID 都是唯一的。

Answer 1

如果单击事件发生在特定行上，并且该元素是该行的子元素，则可以使用上下文来获取结果。

$(".myRow").click(function() {
    var somethingFromMyRow = $(".myChildClassName", this).text();
    alert(somethingFromMyRow);
});

请注意，您不应该在页面上的任何位置重复相同的 ID，因此我提供的示例使用类名 - 因此假设您的示例具有这样的 HTML。

<tr class="myRow">
    <td><span class="myChildClassName">Some Text In Row 1</span></td>
    <td>More Stuff</td>
</tr>
<tr class="myRow">
    <td><span class="myChildClassName">Some Text In Row 2</span></td>
    <td>More Stuff</td>
</tr>
<tr class="myRow">
    <td><span class="myChildClassName">Some Text In Row 3</span></td>
    <td>More Stuff</td>
</tr>