JavaScript 的jQuery 方法prepend before什么区别?附代码.
本文介绍了JavaScript 的jQuery 方法prepend before什么区别?附代码.的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
这俩我怎么做了个实验,效果一模一样?
<head>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<title>jQuery 添加节点 prepend</title>
</head>
<style>
body{margin:0px;padding:0px;font-size:11px;line-height:13px;}
#a{float: left;background-color:#ffc6df;width:550px;height:300px;overflow: hidden;}
#b{float: left;background-color:#459df5;width:550px;height:300px;overflow: hidden;}
.hz{color:red;}
.lz{color:blue;}
</style>
<script>
function AddQian()
{
$("pp").prepend("<p class=\"hz\">这是.prepend.在之前插入的!</p>");
};
function AddHou()
{
$("pp").append("<p class=\"lz\">这是.append.在之后插入的!</p>");
};
function AddQian2()
{
$("pp").before("<p class=\"hz\">这是.before.在之前插入的!</p>");
};
function AddHou2()
{
$("pp").after("<p class=\"lz\">这是.after.在之后插入的!</p>");
};
</script>
<button onclick="AddQian()">在前</button>
<button onclick="AddHou()">在后</button>
<button onclick="AddQian2()">在前1</button>
<button onclick="AddHou2()">在后2</button>
<br>
<boby>
<div id="a">
<pp>这是原始的,被【pp】包裹的。</pp>
<pp>这是原始的,被【pp】包裹的。</pp>
</div>
<div id="b"></div>
</boby>
解决方案
一个是元素内， 一个是元素外
<div class="out">
<!--$('.out').prepend 和 $('.inside').before 都出现在这里-->
<div class="inside"></div>
</div>这篇关于JavaScript 的jQuery 方法prepend before什么区别?附代码.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
