慕数据1201694
2016-12-14 13:57
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>环境搭建</title>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<style type="text/css">
.aaron1{
border: 1px solid red;
}
.aaron1 p{
color: red;
}
.aaron2{
border:1px solid blue ;
}
.aaron p{
color:blue;
}
</style>
</head>
<body>
<h2>通过prepend与prependTo添加元素</h2>
<button id="btn1">点击通过jQueryd的prepend添加元素</button>
<button id="btn2">点击通过jQueryd的prependTo添加元素</button>
<div class="aaron1">
<p>测试prepend</p>
</div>
<div class="aaron2">
<p>测试prepend</p>
<script type="text/javascript">
$("#btn1").on("click",function () {
$(".aaron1").prepend("<p>prepend增加的p元素</p>")
})
</script>
<script type="text/javascript">
$("#btn2").on("click",function () {
$("<p>prependTo添加的元素</p>").prependTo($("aaron2"))
})
</script>
</div>
</body>
</html>
<script type="text/javascript">
$("#btn1").on("click",function () {
$(".aaron1").prepend("<p>prepend增加的p元素</p>")
}), $("#btn2").on("click",function () {
$("<p>prependTo添加的元素</p>").prependTo($("aaron2")) })
</script>
上面的prependTo($("aaron2")) 应该写成 prependTo(".aaron2")
<script type="text/javascript">
$("#bt1").on('click', function() {
//找到class="aaron1"的div节点
//然后通过prepend在内部的首位置添加一个新的p节点
$('.aaron1')
.prepend('<p>prepend增加的p元素</p>')
})
</script>
<script type="text/javascript">
$("#bt2").on('click', function() {
//找到class="aaron2"的div节点
//然后通过prependTo内部的首位置添加一个新的p节点
$('<p>prependTo增加的p元素</p>')
.prependTo($('.aaron2'))
})
</script>
这样也没错吧
jQuery基础(二)—DOM篇
114014 学习 · 590 问题
相似问题