jQuery 元素追加
今天有时间看了看jquery的东西
在这跟大家分享一下DOM动态追加元素
这里列举了添加新内容的五个jQuery方法：
append()-在被选元素的结尾插入内容
prepend()-在被选元素的开头插入内容
after()-在被选元素之后插入内容
before()-在被选元素之前插入内容
appendTo()-将你的元素添加到哪里
append()和prepend()方法能够通过参数接收无限数量的新元素。可以通过jQuery来生成文本/HTML
这些元素可以通过text/HTML、jQuery或者JavaScript/DOM来创建。然后我们通过append()方法把这些新元素追加到文本中（对prepend()同样有效）；
after()和before()方法能够通过参数接收无限数量的新元素。可以通过text/HTML、jQuery或者JavaScript/DOM来创建新元素。
这些元素可以通过text/HTML、jQuery或者JavaScript/DOM来创建。然后我们通过after()方法把这些新元素插到文本中（对before()同样有效）；
after、append、appendTo三个函数的区别
1、after函数
定义和用法：
after()方法在被选元素后插入指定的内容。
语法：
$(selector).after(content)
实例：
<html>
<head>
<scripttype="text/javascript"src="/jquery/jquery.js"></script>
<scripttype="text/javascript">
$().ready(function(){
$("button").click(function(){
$("span").after("<ahref="#">ddddd</a>")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下：
<span>aaaaaaaaaaaaaaa</span>
<ahref="#">ddddd</a>
span标签后面多了一个a标签
2、append函数
定义和用法：
append()方法在被选元素的结尾（仍然在内部）插入指定内容。
语法：
$(selector).append(content)
实例：
<html>
<head>
<scripttype="text/javascript"src="/jquery/jquery.js"></script>
<scripttype="text/javascript">
$().ready(function(){
$("button").click(function(){
$("span").append("<ahref="#">ddddd</a>")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下：
<span>aaaaaaaaaaaaaaa<ahref="#">ddddd</a></span>
span标签里面多了一个a标签
3、appendTo函数
定义和用法：
appendTo()方法在被选元素的结尾（仍然在内部）插入指定内容。
语法：
$(content).appendTo(selector)实例：
<html>
<head>
<scripttype="text/javascript"src="/jquery/jquery.js"></script>
<scripttype="text/javascript">
$().ready(function(){
$("button").click(function(){
//$("span").appendTo("<ahref="#">ddddd</a>"),这样的写法是不正确的
$("<ahref="#">ddddd</a>").appendTo("span")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下：
<span>aaaaaaaaaaaaaaa<ahref="#">ddddd</a></span>
span标签里面多了一个a标签
效果和append函数是一样，只不过它们的写法是反着来写的而已
自己最近在弄这些，希望能对阅读者有帮助---