jquery1.9学习笔记 之选择器(基本元素五)

时间:2022-07-19 20:26:47

多种元素选择器  jQuery("selector1,selector2,selectorN")

例子:

<!doctype html>

<html lang='zh'>

<head>

<meta charset='utf-8'>

<title>multiple demo</title>

<style type="text/css">

</style>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

</head>

<body>

<div>div</div>

<p class='myClass'>p class='myClass'</p>

<p class='notMyClass'>p class='notMyClass'</p>

<span>span</span>

<script>

$("div,span,p.myClass").css("border","3px solid red");

</script>

</body>

</html>

jquery1.9学习笔记 之选择器(基本元素五)

例:

<!doctype html>

<html lang='zh'>

<head>

<meta charset='utf-8'>

<title>multiple demo</title>

<style type="text/css">

b{

color:red;

font-size: 16px;

display: block;

clear: left;

}

div,span,p{

width: 40px;

height: 40px;

float: left;

margin: 10px;

background-color: blue;

padding: 3px;

color:white;

}

</style>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

</head>

<body>

<span>span</span>

<p>p</p>

<p>p</p>

<div>div</div>

<span>span</span>

<p>p</p>

<div>div</div>

<b></b>

<script type="text/javascript">

var list = $("div,p,span").map(function(){

return this.tagName;

}).get().join(", ");

$("b").append(document.createTextNode(list));

</script>

</body>

</html>

jquery1.9学习笔记 之选择器(基本元素五)