Question

我正在尝试运行一个在div仅包含inline elements

的情况下执行的函数

我不确定如何排除每个块元素并检查div不包含该元素。

$(this).children().each(function(){
    if(this.nodeName.toLowerCase() == 'p' || this.nodeName.toLowerCase() == 'h1' etc...){
        check = true; //it contains block element so it is not only inline elements
        return false;
     }
});

有更好的方法吗？

修改

为了帮助澄清，我有一个内容可编辑div，问题是用户可以删除div中的所有块元素。我需要检查这个并向div添加一个块元素。

Answer 1

检查这些元素是否实际上是块级的，因为CSS可以完全改变它们的行为：

var has_inline = $('#parent').children().filter(function() {
    return $(this).css('display') !== 'block';
}).length > 0;

我不确定你认为inline-block是什么，所以我只是假设它的行为类似于inline元素。

演示：http://jsfiddle.net/hXckq/2/

Answer 2

jQuery中的has()如何：

if ($(this).has("p,h1, ...")) { ... }

Answer 3

您可以将内联元素放入哈希值，然后使用in或hasOwnProperty：

var inline = {
    "span": true,
    "a": true,
    ...
};

if(this.nodeName.toLowerCase() in inline) {

}

Answer 4

也许试试这个，检查每个元素的css属性是否确实是内联的，这应该可行，虽然我没有测试这个语法可能不正确：

$(this).children().each(function(){
    if($(this).css('display', 'inline') == true){
        return true;
    }else{
        return false;
    }
}

检查div是否只包含内联元素

4 个答案: