Clever Geek Handbook

div

, . , . , , , .

:

<tbody>
    <tr>
        <td class="Product">
            <div class="ProductWrapper">
                <a class="ProductThumb" href="#">
                    <img src="#" />
                </a>
                <a class="ProductName" href="#">Example</a>
                <meta itemprop="name" content="Example""="">
                <div class="Status">
                    <link href="#">
                    In Stock
                </div>
                <div class="Price">
                    <b>$0.00</b>
                    <meta itemprop="priceCurrency" content="USD">
                </div>
             </div>
         </td>
         <td class="ProductSpacer"><div></div></td>
         <td class="Product">
            <div class="ProductWrapper">
                <a class="ProductThumb" href="#">
                    <img src="#" />
                </a>
                <a class="ProductName" href="#">Example</a>
                <meta itemprop="name" content="Example""="">
                <div class="Status">
                    <link href="#">
                    In Stock
                </div>
                <div class="Price">
                    <b>$0.00</b>
                    <meta itemprop="priceCurrency" content="USD">
                </div>
             </div>
         </td>
    </tr>
</tbody>

, , , (1000), , , , - . , div. jQuery, .

:

<tbody>
    <tr>
        <td class="Product">
            <div class="ProductWrapper">
                <a class="ProductThumb" href="#">
                    <img src="#" />
                </a>
                <div class="ProductInfo">
                    <a class="ProductName" href="#">Example</a>
                    <meta itemprop="name" content="Example""="">
                    <div class="Status">
                        <link href="#">
                        In Stock
                    </div>
                    <div class="Price">
                        <b>$0.00</b>
                        <meta itemprop="priceCurrency" content="USD">
                    </div>
                </div>
             </div>
         </td>
         <td class="ProductSpacer"><div></div></td>
         <td class="Product">
            <div class="ProductWrapper">
                <a class="ProductThumb" href="#">
                    <img src="#" />
                </a>
                <div class="ProductInfo">
                    <a class="ProductName" href="#">Example</a>
                    <meta itemprop="name" content="Example""="">
                    <div class="Status">
                        <link href="#">
                        In Stock
                    </div>
                    <div class="Price">
                        <b>$0.00</b>
                        <meta itemprop="priceCurrency" content="USD">
                    </div>
                </div>
             </div>
        </td>
    </tr>
</tbody>

, , :

$(".ProductThumb").nextUntil('td').wrapAll("<div class='ProductInfo'>");

. , jQuery html.

~~~~~~~~~~~~~

[ 1:] . :

-, " TD. , .

-, , HTML, .

, TD. -, , . (, , ...) div.

:

<a class="ProductThumb"> ... </a>
<div class="ProductInfo"> ... </div>

.

+3




2


HTML

<table>
<tbody>
    <tr>
        <td class="Product">
            <div class="ProductWrapper">
                <a class="ProductThumb" href="#">
                    <img src="#" />
                </a>
                <a class="ProductName" href="#">Example</a>
                <meta itemprop="name" content="Example""="">
                <div class="Status">
                    <link href="#">
                    In Stock
            </div>
                <div class="Price">
                    <b>$0.00</b>
                    <meta itemprop="priceCurrency" content="USD">
            </div>
         </td>
         <td class="ProductSpacer"><div></div></td>
         <td class="Product"></td>
</tr>
</tbody>
</table>


JS CODE

$(".ProductThumb").siblings('.Price').wrapAll("<div class='ALLNEW' />");

LIVE DEMO

+1




: :

$(".ProductThumb").parent().wrapinner("<div class='ALLNEW'>");

:



$(".ProductWrapper").wrapinner("<div class='ALLNEW'>");

Edit: , :not()

:

$(".ProductWrapper").children(":not(a, img)").wrapAll("<div class='ALLNEW'>");
+1








More articles:


All Articles