jQuery获取子元素的属性答案

【问题标题】：Jquery get attr of child elementjQuery获取子元素的属性
【发布时间】：2014-05-28 13:45:40
【问题描述】：

你好，我有这个代码结构：

<ul id="list">
    <li style="background-color: rgb(100, 100, 100);">
        <a href="/anyHref_1">list_1</a>
    </li>
    <li style="background-color: rgb(50, 50, 50);">
        <a href="/anyHref_2">list_2</a>
    </li>
</ul>

我需要从列表的子元素“a”中获取href，背景颜色为：rgb(100, 100, 100)，所以：

var test = $('ul#list li[style~="backgroundColor: rgb(100, 100, 100)"] > a').attr('href');

但是测试是未定义的：/ 任何人都可以告诉我我做错了什么？谢谢！！和问候:)

【问题讨论】：

jsfiddle.net/x96Je/3你可以试试这个。

标签： javascript jquery html css get

【解决方案1】：

你可以使用filter吗？这将返回背景为rgb(100,100,100)的所有lis：

$("li").filter(function() {
   return $(this).css("background-color") === "rgb(100, 100, 100)";
});

jsFiddle

获取单个链接的href：

var href = $("li").filter(function() {
   return $(this).css("background-color") === "rgb(100, 100, 100)" 
}).find("a").prop("href");

我选择这种方法的原因是因为它不依赖于 style 属性，它可能不会以你期望的方式输入。

【讨论】：

只需在末尾添加.find("a").prop("href") :) @user3683881 更新答案
如果我的浏览器使用 RGBA，那么 css() 会返回一个 RGBA 值吗？
@adeneo 如果未设置为 rgba() 值，则不会。至少最新版本的 Chrome 不适合我...
@RGraham - 最新版本的 chrome 对我来说也没有，但它曾经是一个问题，只是不确定在哪个浏览器/版本中？

【解决方案2】：

您的选择器中有错误。它应该是背景色

$('ul#list li[style="background-color: rgb(100, 100, 100);"] > a').attr("href")

而不是背景颜色

【讨论】：

【解决方案3】：

您必须使用 *= 并将 backgroundColor 更改为背景颜色

var test = $('ul#list li[style*="background-color: rgb(100, 100, 100)"] > a').attr('href');

http://jsfiddle.net/x96Je/1/

【讨论】：