Question

我刚刚开始使用Jquery ......至少我刚刚开始掌握它。现在我正在尝试将内容从位置a切换到位置b

现在我有一个选择器，我想要获取HTML内容并将其放在另一个位置。但问题是我还没有定义任何类。 HTML代码使用了大约900次，我不想改变所有这些。

        <table style="width: 100%" class="layout-table two">
        <tr>
            <td class="First">
                The source content
            </td>
            <td>
                <!--- HERE IT SHOULD BE!!!  AKA TARGET -->
                <h2>Welcome at my testcase</h2>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer 
                </p>
            </td>
        </tr>
    </table>

这就是表格的样子

            $(document).ready( function () {
            var SpecialSubmenu = $(".First").html();
            $( ".layout-table .First" ).html('');
            $( ".layout-table tr td" ).prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );
            $( "#TabletSubmenu" ).html( SpecialSubmenu );
            $( ".layout-table .First" ).remove();
        });

这就是我的JQuery代码。但它有效.... 它适用于我的HTML页面中的所有设置表。

现在我知道我犯了哪些错误。那是在这里：

$( ".layout-table tr td" ).prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );

在CSS中确实会： .layout-table tr td { 一些风格...... }

但是JQUery不这么认为。而且我不知道如何具体选择第一个TR和TD标签。

（删除前一个。）

希望你理解我的问题。

TIAD !!

修改的

我的意思是：

我有

<table class="MyTable">
<tr>
    <td class="First">Source</td>
</tr>
<tr>
    <td>
        <!-- TARGET -->
        <table>
            <tr>
                <td>Something I want to remain</td>
                <td>And not change</td>
            </tr>
        </table>
    </td>
</tr>

但是我的例子中发生的事情是，不仅在我的代码中添加了。但也在＆＃34; 我希望保留的东西＆＃34; AND＆＃34; 而不是改变＆＃34;

Answer 1

您可以使用组合:first和first()或:eq()和eq()来获取表格的特定tr和td：

$( ".layout-table tr:first td" ).first().prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );

或者您也可以:eq()跟随.first()：

$( ".layout-table tr:eq(0) td" ).first().prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );

或使用:first后跟.eq(0)：

$( ".layout-table tr:first td" ).eq(0).prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );

或完全使用:eq()和.eq()：

$( ".layout-table tr:eq(0)td" ).eq(0).prepend( '<div id="TabletSubmenu" style="background: #CCCCCC;">' + SpecialSubmenu + '</div>' );

JQuery选择器标签SUB选择器

1 个答案: