Heim  >  Artikel  >  Web-Frontend  >  jQuery: Definition und Verwendung des übergeordneten Selektors_jquery

jQuery: Definition und Verwendung des übergeordneten Selektors_jquery

WBOY
WBOYOriginal
2016-05-16 16:42:421142Durchsuche

:Definition und Verwendung des übergeordneten Selektors:

Dieser Selektor gleicht Elemente ab, die untergeordnete Elemente oder Text enthalten.
Hinweis: Leerzeichen gelten auch als enthaltene Elemente.

Grammatikstruktur:

$(":parent")

Dieser Selektor wird im Allgemeinen in Verbindung mit anderen Selektoren verwendet, z. B. Klassenselektoren, Elementselektoren usw. Zum Beispiel:

$("div:parent").animate({width:"300px"})

Der obige Code kann die Breite eines Divs, das Text oder Elemente enthält, auf 300 Pixel festlegen.
Wenn er nicht mit anderen Selektoren verwendet wird, ist der Standardstatus mit dem *-Selektor zu verwenden, zum Beispiel ist $(":parent") äquivalent zu $("*:parent").

Beispielcode:

Beispiel 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>

Der obige Code kann die Breite eines Divs, das Text oder Elemente enthält, in einer benutzerdefinierten Animation auf 300 festlegen.

Beispiel 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>

Da der obige Code keinen Selektor angibt, der mit dem :parent-Selektor verwendet werden soll, wird er standardmäßig mit dem *-Selektor verwendet. Daher kann der Code die Breite von Elementen festlegen, die Text und Elemente in einer benutzerdefinierten Animation enthalten. 300px.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn