jquery 在兄弟節點前、或兄弟節點後新增最新元素
阿新 • • 發佈：2020-12-21
技術標籤：jquery
使用 jquery 封裝好的方法操作 dom，非常方便
1、在兄弟節點前新增最新元素
使用 before() 方法
演示程式碼如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery-3.2.1.min.js"></script> </head> <body> <div id="app"> <div id="content">content</div> </div> <button onclick="before()">before</button> <script> var i=1; function before() { var htmldiv = '<div>' + i + '</div>'; $("#content").before(htmldiv) i++; } </script> </body> </html>
執行效果
2、在兄弟節點後新增最新元素
使用after() 方法
演示程式碼如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery-3.2.1.min.js"></script> </head> <body> <div id="app"> <div id="content">content</div> </div> <button onclick="after()">after</button> <script> var i=1; function after() { var htmldiv = '<div>' + i + '</div>'; $("#content").after(htmldiv) i++; } </script> </body> </html>
執行效果
至此完