<body>
<div id="jquery">jQuery
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<p>4</p>
<p>5</p>
<p>6</p>
</div>
</div>
<div class="1 2">jQuery1</div>
<div class="1">jQuery2</div>
<span bs='1'>今天天气不错</span>
<span bs='2'>卡屯~海瑟搜</span>
<span bs='num1'>卡屯~海瑟搜</span>
<span bs='num2'>卡屯~海瑟搜</span>
<span bs='no'>卡屯~海瑟搜</span>
<span bs='222no1222'>卡屯~海瑟搜</span>
</body>
</html>
<script>
$(document).ready(function(e) {
jQuery.noConflict();//jQuery 将$所有权让出
var $$ = jQuery;
$$("#jquery").css('color','red');
//alert($$("#jquery").get(0));//返回DOM中索引为0的元素
$('div').eq(1).css('color','green');
$('div>p').css('color','blue');//div中的儿子变蓝色
//群组选择器用逗号分隔，多个class直接跟着写，后代选择器用空格分隔
$('.1.2').css('color','maroon');
//层次选择器
find();//后代选择器
children();//子选择器
next();//当前节点同级的下一个节点
nextAll();//当前节点同级的下面所有节点
prev();//当前节点同级的上一个节点
prevAll();//当前节点同级的上面所有节点
nextUntil('p');//当前节点同级的下面所有节点 遇到p标签就停止
prevUntil('p');//当前节点同级的上面所有节点 遇到p标签就停止
siblings();//当前节点同级的上下所有节点
//属性选择器
$('span[bs]').css('color','red');//选取所有包含bs属性的元素
$('span[bs = 1]').css('color','orange');//选取含有属性bs并且bs属性值是1的元素
$('span[bs != 1]').css('color','orange');//选取含有属性bs并且bs属性值不是1的元素
$('span[bs^=num]').css('color','blue');//选取含有属性bs并且bs属性值以num开头的元素
$('span[bs$=num]').css('color','blue');//选取含有属性bs并且bs属性值以num结尾的元素
$('span[bs*=no1]').css('color','red');//选取含有属性bs并且属性值包含no1字符串的元素
});
</script>
