: Définition et utilisation du sélecteur parent :
Ce sélecteur correspond aux éléments qui contiennent des éléments enfants ou du texte.
Remarque : Les espaces sont également considérés comme des éléments contenus.
Structure grammaticale :
$(":parent")
Ce sélecteur est généralement utilisé en conjonction avec d'autres sélecteurs, tels que les sélecteurs de classe, les sélecteurs d'éléments, etc. Par exemple :
$("div:parent").animate({width:"300px"})
Le code ci-dessus peut définir la largeur d'un div contenant du texte ou des éléments à 300 px.
S'il n'est pas utilisé avec d'autres sélecteurs, l'état par défaut doit être utilisé avec le sélecteur *, par exemple, $(":parent") est équivalent à $("*:parent").
Exemple de code :
Exemple 1 :
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <style type="text/css"> div{ list-style-type:none; width:150px; height:30px; border:1px solid red; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("div:parent").animate({width:"300px"}) }) }) </script> </head> <body> <div>我是文本</div> <div></div> <button>点击查看效果</button> </body> </html>
Le code ci-dessus peut définir la largeur d'un div contenant du texte ou des éléments à 300 dans une animation personnalisée.
Exemple 2 :
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <style type="text/css"> div{ list-style-type:none; width:150px; height:30px; border:1px solid red; } span{border:1px solid green;} </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("*:parent").animate({width:"300px"}) }) }) </script> </head> <body> <div>我是文本</div> <div></div> <span>大家好</span> <button>点击查看效果</button> </body> </html>
Étant donné que le code ci-dessus ne spécifie pas de sélecteur à utiliser avec le sélecteur :parent, il est utilisé par défaut avec le sélecteur *. Par conséquent, le code peut définir la largeur des éléments contenant du texte et des éléments dans une animation personnalisée. 300px.