jQuery 插入prepend()與prependTo()
在元素內部進行操作的方法,除了在被選元素的結尾(仍在內部)透過append與appendTo插入指定內容外,對應的還可以在被選元素之前插入,jQuery提供的方法是prepend與prependTo
選擇器的描述:
下面我們來寫一個實例來講解,程式碼如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>prepend与prependTo</title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <ul> <li id="li1">php 中文网</li> <li id="li2">php.cn</li> </ul> <input type="button" id="ipt1" value="prepend"> <input type="button" id="ipt2" value="prependTo"> <script> $("#ipt1").click(function(){ $('#li1').prepend("欢迎</br>"); }) $("#ipt2").click(function(){ $('#li2').prepend("欢迎</br>"); }) </script> </body> </html>
注意:prepend( )和.prependTo()實現同樣的功能,主要的不同是語法,插入的內容和目標的位置不同
這裡總結下內部操作四個方法的區別:
append( )在每個符合的元素內部追加內容
prepend()向每個符合的元素內部前置內容
appendTo()將所有符合的元素追加到另一個指定元素的集合中
prependTo()將所有符合的元素前置到另一個指定的元素集合中