jQuery属性选择器

时间:2019-01-17
本文章向大家介绍jQuery属性选择器,主要包括jQuery属性选择器使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

HTML代码:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>京东快报</title>
    <link rel="stylesheet" href="css/newStyle.css">
</head>
<body>
<section id="news">
    <header>京东快报<a href="#" class="more">更多 > </a></header>
    <ul>
        <li><a href="sale.jd.com/act/h7mf8.html" class="hot"><span>[618]</span>志玲姐姐:墨镜300减30</a></li>
        <li><a href="www.jd.com/news.aspx?id=29257"><span>[公告]</span>京东无锡馆正式启动</a></li>
        <li><a href="sale.jd.com/act/k2ad45v.html"><span>[特惠]</span>99元抢平板!品牌配件199-100</a></li>
        <li><a href="www.jd.com/news.aspx?id=29252"><span>[公告]</span>节能领跑京东先行</a></li>
        <li><a href="sale.jd.com/act/ugk2937w.html" class="last"><span>[特惠]</span>高洁丝实力撩货,领券五折</a></li>
    </ul>
</section>
</body>
</html>

jQuery代码:

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script type="text/javascript" >
	$(function(){
		//获取#news a并且a包含class属性名
		//$("#news a[class]").css("background","#ccc");
		//获取#news a并且a的class值等于hot
		//$("#news a[class='hot']").css("background","#B02F4A");
		//获取#news a并且a的class值不等于hot
		//$("#news a[class!='hot']").css("background","#B02F4A");
		//a的href要以www开头
		$("#news a[href^='www']").css("background","red");
		//a的结尾是html
		$("#news a[href$='html']").css("color","yellow");
	})
</script>