使用jQuery检查div是否有具有特定属性的子级

我试图找到语法来确定一个div是否有一个包含

数据角色

属性设置为

头

的子div。我尝试过这些东西，但运气不佳：

$('div[data-role*="page"]').each(function(i) {
    if($(this).children('div').attr('data-role')=='header';) {
        alert("has header");
    }
});

尝试：

---

参考：

在本例中，您有一个尾随的

在
之后=0;

$('div[data-role*="page"]').each(function(i) {
    if ($(this).children('div[data-role="header"]').length != 0) {
        alert("has header");
    }
});

示例。
如果我正确地阅读了这篇文章，那么以下内容应该有效：

$('div[data-role=page]:has(div[data-role])').css('border','1px solid #ccc');

选择包含具有“数据角色”属性的子div的任何div


虽然您似乎希望使用
if
触发
警报（）
，但这似乎是不必要的，因为上面的命令将用作选择器。如果该选择器没有匹配任何元素，那么在我演示的用例中，没有元素会受到影响。另一方面，如果选择了一个元素或多个元素，则将选择这些元素。
这将选择作为子元素的div（数据角色属性设置为header），这些div是div的子元素

$('div > div[data-role=header]')

正如其他地方提到的，在答案中，分号
if
语句/检查中不需要代码>。有时，当某些东西不起作用时，它值得检查。您也可以像这样使用它：
var myDiv=$（'div[data role=page]'）；myDiv.has（'div[data role]））.css（'border'，'1px solid#ccc'）
$('div[data-role=page]:has(div[data-role])').css('border','1px solid #ccc');

$('div > div[data-role=header]')