网站制作学习网JS脚本→正文:jquery文档处理
字体:

jquery文档处理

JS脚本 2010/9/1 18:58:09  点击:不统计

http://%77w%77%2E%66%6F%72%61%73%70%2E%63n网站制作学习
jquery第十一课jquery文档的处理,jquery对文档处理包括添加内容,替换(修改)内容,删除,复制等。
参考共用代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>jquery文档处理</TITLE>
<script language="javascript" src="jquery-1.4.2.min.js"></script>
<SCRIPT language="javascript">
$(function(){
<!--jquery文档处理代码区-->
});
</SCRIPT>
<BODY>
<div id="1"><p>jquery文档处理</p></div>
<p id="www">内部插入</p>
<p id="forasp">外部插入</p>
<p id="cn"></p>
</BODY>
</HTML>
1.jquery文档处理-内部插入,很容易理解,就是将被添加内容添加到已选的元素内部。
(1).append("text");将text添加到每个匹配的元素中
jquery实例:$("p").append("网站制作学习网"); 将上面所有的p内容添加'网站制作学习网'
(2).append(function(index, html));向每个匹配的元素内部追加内容,返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值,html参数为这个对象原先的html值。
jquery实例:$("p").append(function(index,html){if(index>2){return html+"www.forasp.cn";}}); 解释:找到索引大于2的p并将其原来的html内容加上"www.forasp.cn"字符串
(3).appendTo(content);把所有匹配的元素追加到另一个指定的元素元素集合中;使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中
jquery实例:$("#1").text().appentTo($("#cn")); 将<div id="1"><p>jquery文档处理</p></div>添加到<p id="cn"></p>里面结果是<网站制作学习网Foasp.cn>
<p id="cn"><div id="1"><p>jquery文档处理</p></div></p>
(4).prepend(content);prepend(function(index, html));prependTo(content);这三个也是内部插入文档处理,与上面的三个用法相同,不同的是添加的内容是在添加到文档的开始,而上面的三个是添加到添加文档的末尾。
2.jquery文档处理-外部插入,跟内部插入相反,这个将被添加内容添加到已选元素的外部。被添加的内容属于剪切状体
(1).after(content);在每个匹配的元素之后插入内容。
$("#forasp").after("<p>http://www.forasp.cn/</p>"); 即在id=forasp的div后面添加了一个p内容为http://www.forasp.cn/
(2).after(function);在每个匹配的元素之后插入内容。 function 返回的必须是html元素
$("#forasp").after(function(){t=Math.random();if(t>0.5)return"<p>网站制作学习网</p>";}); 即1/2的随机性插入内容。
(3).before(content);在每个匹配的元素之前插入内容。
$("#forasp").before("<p>http://www.forasp.cn/</p>"); 即在id=forasp的div前面添加了一个p内容为http://www.forasp.cn/
(4).before(function);在每个匹配的元素之前插入内容。 function 返回的必须是html元素 例子参考第(2)例子
(5).insertAfter(content);把所有匹配的元素插入到另一个、指定的元素元素集合的后面。
$("#www").insertAfter($("#forasp")); 将id为www的元素插入到id为forasp的后面。等于$("$forasp").after($("$www"));
(6).insertBefore(content);把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
$("#www").insertBefore($("#forasp")); 将id为www的元素插入到id为forasp的前面。等于$("$forasp").before($("$www"));
3.jquery文档处理-内容替换,将已经选的元素替换为新的内容.
(1).replaceWith(content); 将所有匹配的元素替换成指定的HTML或DOM元素
jquery实例:$("p").replaceWith("替换了所有的p元素"); 这样全部的p就消失了,显示'替换了所有的p元素'
(2).replaceAll(selector);用匹配的元素替换掉所有 selector匹配到的元素。跟replaceWith(content);目标相反.
jquery实例:$("<div>替换了所有的p元素<div>").replaceAll($("p")); 这样将新的div替换了p

jquery文档操作今天到这里,明天继续.
http://%77%77%77%2E%66%6F%72%61%73%70%2E%63%6E

·上一篇:jquery对象筛选 >>    ·下一篇:jquery文档处理2 >>
推荐文章
最新文章