1,创建节点
$("<html></html>");
如:$("<p id='name'><a href='##'/></p>");
2,插入节点
方法 | 说明 |
wrap() | 用指定结构的元素包裹元素 |
wrapAll() | 用指定结构的元素包裹多个元素 |
wrapInner() | 用指定结构元素包裹元素的内容 |
<html> <head> <meta charset="UTF-8"> <title></title> <style> div{ border: 1px solid red; } p{ background:yellow; accelerator; margin: 4px; } </style> </head> <body> <p>Hello</p> <p>cruel</p> <p>World</p>
<script type="text/javascript"> //warp() 包裹着指定元素 $("p").wrap("<div></div>");
//wrapAll() 将元素一起包裹 注:如果是不连续的元素 会吧中间隔开的元素挤到最下面 $("p").wrapAll("<div></div>");
//wrapInner() $("p").wrapInner("<b></b>");
</script> </body> </html>
2,节点内部插入
方法 | 说明 |
append() | 向每个匹配元素内部的最后面添加元素 |
appendTo() | 将所有匹配的元素追加到指定的元素中 |
prepend() | 向每个匹配的元素内部最前面添加指定元素 |
prependTo() | 将所有匹配的元素添加到指定元素内部的最前面 |
append();//前者为已有父元素 后者为需要添加到父元素的子元素 $("#demo").append($("<p>aaa</p>"));
appendTo();//前者为需要添加到父元素的子元素 后者为指定的父元素 $($("<p>bbb</p>")).appendTo($("#demo"));
//与上面同理 只是这个是添加到最前面
prepend()
$("#demo").prepend($("<p>ccc</p>"));
prependTo()
$($("<p>ddd</p>")).prependTo($("#demo"));