<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>11.4jQuery选择器全局选择器</title>
<style>
*{
margin:0;
padding:0;
}
div{
width:200px;
height:200px;
background-color:#CCC;
text-align:center;
float:left;
}
body{
width:450px;
height:450px;
}
</style>
<script src="../js/jquery-3.1.1.min.js"></script>
<script>
$(function(){
//全局选择器:*选择器
//格式:$('*')
$('*').css('border','#F00 solid 2px');
//$('*').css('margin','10px');
//通过JS找所有元素,设置margin为10px
var allElements = document.getElementsByTagName('*');
var i;
for(i=0;i<allElements.length;i++)
{
console.log(allElements[i]);
//allElements[i].style.border ='solid 3px red';
allElements[i].style.margin = '10px';
}
});
</script>
</head>
<body>
<div class="js">
<h2>JavaScript</h2>
<p>选中</p>
</div>
<div class="js">
<h2>JavaScript</h2>
<p>选中</p>
</div>
<div class="jq">
<h2>jQuery</h2>
<p>选中</p>
</div>
<div class="jq">
<h2>jQuery</h2>
<p>选中</p>
</div>
</body>
</html>
效果图


