jQuery-文档处理
Posted 加号与剑豪
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery-文档处理相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jq</title> <script src="https://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script> <style> .x{ color:red; } .xx{ color:pink; } </style> </head> <body> <script> $(document).ready(function(){ $("#but1").click(function(){ $("p").prepend("<d>前面</d>"); });//将d元素弄到p中的后面 $("#but2").click(function(){ $("p").append("<f>后面</f>") });//将f元素弄到p中的后面 $("#but3").click(function(){ $("d").prependTo("div"); });//将d元素弄到div中的前面 $("#but4").click(function(){ $("f").appendTo("div"); });//将q元素弄到div中的后面 $("#but5").click(function(){ $("p").before("<z>前面</z>"); });//将s元素弄到p的前面 $("#but6").click(function(){ $("p").after("<x>后面</x>"); });//将s元素弄到p的后面 $("#but7").click(function(){ $("z").insertBefore("div"); });//设置所有 p 元素的内容 $("#but8").click(function(){ $("x").insertAfter("div"); });//返回p元素的文本内容。 }); </script> <input id="but1" type="button" value="里面的前面"> <input id="but2" type="button" value="里面的后面"> <input id="but3" type="button" value="更改前位置"> <input id="but4" type="button" value="更改后位置"> <input id="but5" type="button" value="外面的前面"> <input id="but6" type="button" value="外面的后面"> <input id="but7" type="button" value="更改外前位置"> <input id="but8" type="button" value="更改外后位置"> <br /> <div>xxx</div> <br /> <p>yyy</p> </body> </html>
以上是关于jQuery-文档处理的主要内容,如果未能解决你的问题,请参考以下文章