在某个元素之前添加元素

Question

我有这段代码：

<td>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
      abc
    </div>
</td>

我想在这段代码中添加另一个元素：

<p>blablablalblablab</p>
 <td>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
       abc
     </div>
 </td>

我使用此代码

 $("#vB_Editor_QR_cmd_insertimage").before("<p>blablablalblablab</p>");

但它只放在div标签之前。

 <td>
    <p>blablablalblablab</p>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
       abc
     </div>
 </td>

我想要这样

 <p>blablablalblablab</p>
     <td>
        <div id="vB_Editor_QR_cmd_email" class="imagebutton">
           abc
         </div>
     </td>

Answer 1

试试这个，

$("#vB_Editor_QR_cmd_insertimage").parents("td:first").before("<p>blablablalblablab</p>");

父母（“td：first”）将返回div的第一个父母

希望这有帮助......

Answer 2

使用before或insertBefore将元素放在另一个元素之前。

$("<p>blablablalblablab</p>").insertBefore("td");

或

$("td").insertBefore("<p>blablablalblablab</p>");

或更具体的html：

$("vB_Editor_QR_cmd_email").parent("td").before(...);

虽然这只是一个（不好）的例子，但这是无效的。您不能在<p>之前直接拥有<td>代码，因为这意味着<p>位于<tr>之内。

Answer 3

这将选择具有嵌套div的td元素，其id为vB_Editor_QR_cmd_insertimage。它还提供了一种更简洁的方法来创建一个html元素（jQuery提供）

$("div#vB_Editor_QR_cmd_insertimage").closest("td")
.before($("<p/>", { text: "blablablalblablab" }));