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

Question

我正在尝试找到语法来确定div是否具有包含data-role属性设置为的子div header.我试过这些东西没有运气:

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

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

Answer 1

在这个例子中,你有一个尾随;后!=0;

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

关于jsfiddle的例子.

Answer 2

尝试:

if ($('div[data-role*="page"]').has("div[data-role=header]").size() > 0)
    alert("Has header");

参考: http ://api.jquery.com/has/

Answer 3

如果我正确读到这个,那么以下内容应该有效:

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

选择包含具有"data-role"属性的子div的任何div.

JS小提琴.

虽然你似乎想利用一个if来触发一个alert(),但这似乎是不必要的,因为上面将作为一个选择器.如果该选择器没有匹配任何元素,那么在我演示的用例中,不会影响任何元素.另一方面,如果选择了一个元素,或者选择了多个元素,则会选择那些元素.