jQuery中的一些常见方法小结(推荐)
1.filter()和not()方法
filter()和not()是一对反方法，filter()是过滤.
filter()方法是针对元素自身。（跟has()方法有区别）
<scripttype="text/javascript"src="jquery-1.12.3.min.js"></script>
<script>
/*filter():过滤
not():filter的反义词<BR>*/
$(function(){
//$('div').filter('.box').css('background','red');<SPANstyle="COLOR:#ff0000">//将div中带有class=‘box'的div的背景色改成红色</SPAN>
$('div').not('.box').css('background','red');<SPANstyle="COLOR:#ff0000">//将div中除带有class=‘box'的div的其他div设置背景色为红色</SPAN>
?
1});</script><BR></head><BR><body><BR><divclass="box">div</div><BR><div>div2</div><BR></body><BR></html>
2.has()方法
has()方法表示的是包含的意思，它跟filter()方法是有区别的。has()方法有父子级关系。
<scripttype="text/javascript"src="jquery-1.12.3.min.js"></script>
<script>
/*filter():过滤
not():filter的反义词
has():包含*/
$(function(){
//$('div').has('span').css('background','red');<SPANstyle="COLOR:#ff0000">//只有包含span标签的div(父级)的背景色为红色</SPAN>
$('div').has('.box').css('background','red');<SPANstyle="COLOR:#ff0000">//只有包含的标签的class值是box的div(父级)的背景色为红色</SPAN>
});
</script>
</head>
<body>
<div>div
<spanclass="box">
span
</span>
</div>
<divclass="box">div2</div>
<divclass="haha">div3</div>
</body>
</html>
3.next()、prev()、find()、eq()方法
next()、prev()方法就是寻找下一个兄弟节点和上一个兄弟节点。
find()方法：寻找
eq()：索引
<scripttype="text/javascript"src="jquery-1.12.3.min.js"></script>
<script>
/*next():下一个兄弟节点
prev():上一个兄弟节点
find():寻找
eq():索引
*/
$(function(){
//$('div').find('h2').css('background','red');<SPANstyle="COLOR:#ff0000">//只会给div下的所有h2的背景色设置为红色</SPAN>
$('div').find('h2').eq(0).css('background','red');<SPANstyle="COLOR:#ff0000">//给div下的第一个h2的背景设置为红色</SPAN>
});
</script>
</head>
<body>
<div>
<h3>h3</h3>
<h2>h2</h2>
<h2>h2</h2>
<h1>h1</h1>
</div>
<h2>haha</h2>//不会变红
</body>
</html>
4.index()方法
<script>
/*
index():索引就是当前元素在所有兄弟节点中的位置
*/
$(function(){
alert($('#h').index());<SPANstyle="COLOR:#ff0000">//索引就是当前元素在所有兄弟节点中的位置</SPAN>
//弹出是3
});
</script>
</head>
<body>
<div>
<h3>h3</h3>
<h2>h2</h2>
<h2>h2</h2>
<h3id="h">h3</h3>
<h1>h1</h1>
</div>
<h2>haha</h2>
</body>
</html>
4.attr()方法
<scripttype="text/javascript"src="jquery-1.12.3.min.js"></script>
<script>
/*
attr():属性设置
*/
$(function(){
alert($('div').attr('title'));<SPANstyle="COLOR:#ff0000">//获取属性title的值</SPAN>
$('div').attr('title','456');<SPANstyle="COLOR:#ff0000">//设置title属性的值是456</SPAN>
$('div').attr('class','box');<SPANstyle="COLOR:#ff0000">//给div设置class属性，值是box</SPAN>
});
</script>
</head>
<body>
<divtitle="123">div</div>
</body>
</html>
以上这篇jQuery中的一些常见方法小结(推荐)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。