【问题标题】:javascript: Checking if tags are next to each otherjavascript:检查标签是否彼此相邻
【发布时间】:2026-02-15 15:30:02
【问题描述】:

所以问题来了:我想检查元素 <x-statement> 是否就在 <p> 旁边,并且它们之间没有文本。 所以这将返回 true:

<div>
     <x-statement>[discover.prev]</x-statement>
     <p>Go forward<p>
</div>

但这不会:

<div>
     <x-statement>[discover.prev]</x-statement>
     im in the way herr der
     <p>Go forward<p>
</div>

这是我尝试做的:

if($(this).next().is('p')){
    alert("p is next to you");
}

【问题讨论】:

  • 您忘记发布您尝试过但不起作用的 JavaScript。
  • x-statement 不是有效的 tagName
  • document.querySelector('x-statement').nextSibling.tagName.toLowerCase() === 'p';
  • 感谢 adeneo,像魅力一样工作
  • @user3731759 请注意,adeno 的代码在 nextSibling 将纯空格文本节点视为兄弟节点的浏览器中可能无法工作。其中大部分是。

标签: javascript jquery html text tags


【解决方案1】:

这是一个使用 DOM 方法的更强大的函数

function nextIs(self, tag) {
    return self ? ((function(el) {
        while(el && el.nodeValue && el.nodeValue.trim() == '' ) el = el.nextSibling
        return el;
    })(self.nextSibling).tagName || '').toLowerCase() === tag : false;
}

可以用作

var element = document.querySelector('x-statement');
var isNextP = nextIs(, 'p');

FIDDLE

【讨论】:

    【解决方案2】:
    <div id="div1">
         <x-statement>[discover.prev]</x-statement>
         <p>Go forward<p>
    </div>
    
    <div id="div2">
         <x-statement>[discover.prev]</x-statement>
         im in the way herr der
         <p>Go forward<p>
    </div>
    
    var exp = /<x-statement>.*<\/x-statement>\s*\n*<p>.*<\/p>/;
    alert(exp.test($("#div1").html()));
    alert(exp.test($("#div2").html()));
    

    JSFiddle 示例: http://jsfiddle.net/PL9pN/

    【讨论】: