Question

我正在尝试匹配div的h4（使用jQuery），以便我可以删除它的上边距。但是，我只想匹配h4，如果它上面没有文字。例如，匹配此：

<div>
  <h4>Header</h4>
  ...
</div>

但不是这样：

<div>
  Blah blah blah.
  <h4>Header</h4>
  ...
</div>

我在jQuery中提出的最佳代码是：

$("div h4:first-child")

但不幸的是，这与上述情况相符。反正有没有指定你希望它是绝对的第一个元素，之前没有文本节点？

Answer 1

<div>
    <h4>Header</h4>
    ...
</div>

<div>
    Blah blah blah.
    <h4>Header</h4>
    ...
</div>

然后您可以使用以下内容。

$('div').each(function() {
    var me = this;
    if ($(me).html().toUpperCase().indexOf("<H4>") == 0){ //check to see if the inner html starts with an h4 tag
        $(me).children('h4')... //do what you need to do to the header
    }
});

Answer 2

$("div h4")
    .filter(function() {
    var prev = this.previousSibling;
        return (!prev 
            || prev.nodeType !== 3
            || (prev.nodeType == 3 && prev.nodeValue.match(/^\s*$/)));
    })

编辑：修正了它。适用于Firefox，IE8

注意：

'this'指的是节点
两个H4都有一个文本节点。我认为浏览器会在找到空格和换行符的任何地方插入文本节点。在这种情况下，我们只选择那些不仅仅是空白的。
Node.TEXT_NODE在IE中不可用。因此使用幻数3。

如果元素的第一个子元素前面没有文本节点，如何匹配元素的第一个子元素？

2 个答案: