jQuery를 사용하여 노드 요소 교체(코드 첨부)-JS 튜토리얼-php.cn

집

웹 프론트엔드

JS 튜토리얼

jQuery를 사용하여 노드 요소 교체(코드 첨부)

Jun 15, 2018 pm 03:22 PM

이번에는 jQuery를 사용하여 노드 요소를 교체하는 방법(코드 포함)을 알려드리겠습니다. jQuery를 사용하여 노드 요소를 교체할 때 주의 사항은 무엇인가요?

&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot;&gt;
&lt;head&gt;
 &lt;meta charset=&quot;UTF-8&quot;&gt;
 &lt;title&gt;中国&lt;/title&gt;
 &lt;script type=&quot;text/javascript&quot; src=&quot;../jquery-3.3.1/jquery-3.3.1.js&quot;&gt;&lt;/script&gt;
 &lt;script type=&quot;text/javascript&quot;&gt;
  $(document).ready(function () {
   $("button#button-replaceWith").click(function () {
    $("p").replaceWith("&lt;strong&gt;您好!我最喜欢的IT公司是：&lt;/strong&gt;");
    $("[name='name-replace']").replaceWith("&lt;tr&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;td&gt;name-replace&lt;/td&gt;&lt;/tr&gt;");
   });
  });
 &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
 &lt;h2&gt;超实用的jquery代码段-jquery插入节点元素的方法&lt;/h2&gt;
 &lt;p&gt;您好！您最喜欢的IT公司是:&lt;/p&gt;
 &lt;ul&gt;
  &lt;li title=&quot;Google&quot;&gt;Google&lt;/li&gt;
  &lt;li title=&quot;Apple&quot;&gt;Apple&lt;/li&gt;
  &lt;li title=&quot;Microsoft&quot;&gt;Microsoft&lt;/li&gt;
 &lt;/ul&gt;
 &lt;table name=&quot;name-replace&quot;&gt;
 &lt;/table&gt;
 &lt;button id=&quot;button-replaceWith&quot;&gt;替换节点元素&lt;/button&gt;
&lt;/body&gt;
&lt;/html&gt;

로그인 후 복사

번역은 다음과 같습니다: