JQuery建立節點Append與AppendTo區別及其用法
阿新 • • 發佈：2019-01-28
append：這個操作與對指定的元素執行原生的appendChild方法，將它們新增到文件中的情況類似。
appendTo：實際上，使用這個方法是顛倒了常規的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。
append()前面是被插入的物件，後面是要在物件內插入的元素內容 appendTo()前面是要插入的元素內容，而後面是被插入的物件
在本實驗中實現了JQuery的對點選事件的處理。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="../jquery-3.3.1/jquery-3.3.1.js"></script> <style> .content { width: 300px; } .content2 { width: 300px; } .append{ background-color: blue; } .appendTo{ background-color: red; } </style> </head> <body> <h2>通過append與appendTo新增元素</h2> <button id="bt1">點選通過jQuery的append新增元素</button> <button id="bt2">點選通過jQuery的appendTo新增元素</button> <div class="content"></div> <div class="content2"></div> <script type="text/javascript"> $('#bt1').on('click',function(){ $('.content').append('<div class="append">通過append方法新增的元素</div>') }) $('#bt2').on('click',function(){ $('<div class="appendTo">通過appendTo方法新增的元素</div>').appendTo('.content') }) </script> </body> </html>