JQuery appendTo()用法及代码示例

appendTo()是jQuery中的内置方法，用于在所选元素的末尾插入HTML元素。
用法:

$(content).appendTo(selector)

此处元素内容指定要插入的内容。
参数：它接受参数“selector”，该参数指定要附加内容的元素。
返回值：它返回修改后的选定元素。

jQuery代码显示此方法的用法方式：
代码1：
在下面的代码中，id内容与element“span”将附加到id“#hel”元件。

<html> 
   <head> 
      <meta charset="utf-8"> 
      <style> 
         #hel { 
         background: lightgreen; 
         display: block; 
         border: 2px solid green; 
         padding: 10px; 
         width: 300px; 
         } 
      </style> 
      <script src="https://code.jquery.com/jquery-1.10.2.js"> 
      </script> 
   </head> 
   <body> 
      <span>geeks Writer !!!</span> 
      <div id="hel">Hello-  </div> 
      <script> 
         $("span").appendTo("#hel"); 
      </script> 
   </body> 
</html>

输出：

代码2：
在下面的代码中，我们使用此方法直接附加“p”元素。

<html> 
   <head> 
      <meta charset="utf-8"> 
      <style> 
         body{ 
         display: block; 
         width: 250px; 
         height: 100px; 
         border: 2px solid green; 
         padding: 10px; 
         } 
      </style> 
      <script src="https://code.jquery.com/jquery-1.10.2.js"> 
      </script> 
   </head> 
   <body> 
      <h2>Greetings from gfg !</h2> 
      <div class="container"> 
         <div class="inner"> 
            Hello 
         </div> 
      </div> 
      <script> 
         $( "<p>Everyone !!!</p>").appendTo( ".inner" ); 
      </script> 
   </body> 
</html>

输出：

相关用法

注：本文由纯净天空筛选整理自kundankumarjha大神的英文原创作品 jQuery | appendTo() with Examples。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。