Question

在表单上，我必须从表单中存在的所有列表项中选择具有特定属性值的所有第一个<a>元素。例如，在下面的代码中，我必须选择包含内容<a>和xxx的{{1}}元素 - 换句话说，第一个zzz元素{{1}来自所有列表项。

＆＃13;

<a>

＆＃13;

data-role="modal"

＆＃13;

我尝试的jQuery只选择console.log($('ul li a[data-role="modal"]:first'));。

Answer 1

您可以使用.find()获取a中包含属性data-role=modal的所有ul li个元素，并应用:eq获取每个匹配的第一个元素：

$('ul li').find('a[data-role="modal"]:eq(0)').css('color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>
    <a data-role="modal">xxx</a>
    <a data-role="modal">yyy</a>
  </li>
  <li>
    <a>abc</a>
    <a data-role="modal">zzz</a>
    <a data-role="modal">xyz</a>
  </li>
</ul>

<强>参考

.find()

:eq

Answer 2

尝试：

$('ul li').find('a[data-role="modal"]:first')

＆＃13;

console.log( $('ul li').find('a[data-role="modal"]:first').map(function() {
    return $(this).text();
}).get() );

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
<li>
<a data-role="modal">xxx</a>
<a data-role="modal">yyy</a>
</li>


<li>
<a>abc</a>
<a data-role="modal">zzz</a>
<a data-role="modal">xyz</a>
</li>
</ul>

＆＃13;

Answer 3

检查

$('document').ready(function(){
    $('ul li').each(function(){
     $(this).find('a[data-role=modal]:first').css('background-color','red');
    });
});

Answer 4

我想这可能会有所帮助

$('document').ready(function(){
    $('ul li').each(function(){
     $(this).find('a[data-role="modal"]').first().css('background-color','red');
    });
});

选择具有特定属性值的所有第一个元素

4 个答案: