Question

.find('.woocommerce-tabs').not('.tabs').html();

上面是用于查找类的jQuery的一部分，但排除了.tabs元素的子.woocommerce-tabs。

但仍然.tabs出现在输出中，这不是我想要的。

示例html输出

<div class="woocommerce-tabs">
    <ul class="tabs">

        <li class="description_tab active">
            <a href="#tab-description">Description</a>
        </li>


        <li class="additional_information_tab">
            <a href="#tab-additional_information">Additional Information</a>
        </li>

    </ul>

    <div class="panel entry-content" id="tab-description" style="display: block;">

        <h2>Product Description</h2>

        <ul>
            <li>Robust</li>
            <li>Continuous 360° turntable rotation</li>
        </ul>
    </div>


    <div class="panel entry-content" id="tab-additional_information" style="display: none;">

        <h2>Additional Information</h2>

        <table class="shop_attributes">
            <tbody>
                <tr class="">
                    <th>Tires (foam-filled)</th>
                    <td>
                        <p>16"</p>
                    </td>
                </tr>
                <tr class="">
                    <th>Weight (kg)</th>
                    <td>
                        <p>6950</p>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

</div>

Answer 1

您的代码会过滤掉没有tabs className的元素，但它不会从html输出中排除指定的元素。您可以.clone()元素，删除后代，然后调用.html()方法。

.find('.woocommerce-tabs').clone().find('.tabs').remove().end().html();

http://jsfiddle.net/aT7zX/

Answer 2

尝试:has()

.find('.woocommerce-tabs').not(':has(.tabs)').html();

.not(':has(.tabs)')不选择具有类tabs

元素的元素

Answer 3

一种方法是克隆您的.woocommerce-tabs并从克隆元素中删除.tabs。

var clone = $'.woocommerce-tabs').clone();
clone.find('.tabs').remove();
var html = clone.html();

然后您可以在代码中使用克隆的html：

.find('.woocommerce-tabs').not('.tabs').html(html);

jQuery使用.not（）排除部分内容

3 个答案: