jQuery属性选择器

最新推荐文章于 2024-05-12 11:31:09 发布

小仓桑

最新推荐文章于 2024-05-12 11:31:09 发布

阅读量523

点赞数

分类专栏： jQuery 文章标签： jQuery

本文链接：https://blog.csdn.net/qq_43462019/article/details/86521393

版权

jQuery 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

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");
                //a标签href属性值包含"K2"的元素
		$("#news a[href*='k2']").css("background","chartreuse");
	})
</script>

小仓桑

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jQuery属性选择器

HTML代码：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;京东快报&lt;/title&gt; &lt;link rel="stylesheet" href=&q
复制链接

扫一扫

专栏目录