1.获取jquery对象对应元素的内容
.html() 方法来获取任意一个元素的内容
实例1:
<button id="btn1" value="1">测试</button><br/>
$('#btn1').click(function(){
alert($(this).html());//结果:测试
$(this).html('nihao');//设置内容
});
2.数组遍历:
//遍历数组袁术
var arr=[2,3,4,5];
$.each(arr, function(i,n) {
console.log(i+" "+n);
});
3.//去左右空格
var str =' my guigu ';
console.log("----"+$.trim(str)+"--");
4.
<body>
<div>
<button id="btn1">测试1</button><br/>
<button id="btn2">测试2</button><br/>
<button id="btn3">测试3</button><br/>
</div>
<script>
$(function(){
//统计按钮的个数
var $buttons=$('button');
console.log($buttons.length);
//获取第二个按钮
console.log($buttons[1].innerHTML);
//遍历
/*$buttons.each(function(index,element){
console.log(index+" "+element.innerHTML,this);
})*/
$buttons.each(function(){
console.log(this.innerHTML);
});
});
</script>
</body>
5.选择器
5.1基本选择器
$('#div1'),$('.div1'),$('div')
5.2层级选择器
查询后代选择器:$('ul span').css('background','yellow');
查询子代选择器:$('ul>span').css('background','yellow');
匹配所有紧跟在 prev 元素后的 next 元素:$('.box+li').css('background','yellow');
匹配 prev 元素之后的所有 siblings 元素:$('.box~*').css('background','yellow');
总结:空格找后代,>找子元素,+找下一个元素,~找后面的兄弟元素
5.3基本筛选器:
:first
//选择第一个div
/$('div:first').css('background','yellow');
:not
//选择class不等于box的div元素
$('div:not(.box)').css('background','yellow');