代码之家 › 专栏 › 技术社区 › travis

如何判断jQuery节点是否位于其父节点的开头?

dom html jquery javascript

travis · 技术社区 · 16 年前

给定以下HTML:

<p><img id="one" alt="at beginning, return true" />Some Text</p>
<p>Some <img id="two" alt="in middle, return false" />Text</p>
<p>Some Text<img id="three" alt="at end, return false" /></p>

我怎么知道呢 $("img#one")

$("p>img").each(function () {
    var $this = $(this);
    var $parent = $this.parent();
    if ("$this is at the beginning of $parent.html()") {
        $parent.before($this);
    } else {
        $parent.after($this);
    }
});

编辑: 具有 sebasgo's help

$("p>img").each(function () {
    var $this = $(this);
    var $parent = $this.parent();
    if (this == this.parentNode.firstChild) {
        $parent.before($this);
    } else {
        $parent.after($this);
    }
});

<img id="one" alt="at beginning, return true" />
<p>Some Text</p>
<p>Some Text</p>
<img id="two" alt="in middle, return false" />
<p>Some Text</p>
<img id="three" alt="at end, return false" />

4 回复 | 直到 9 年前

sebasgo 16 年前

var elem = $("img#one").get(0)
if (elem.parentNode.firstChild == elem)
{ .... }

希望这个效果更好。

chrismacp 15 年前

下面的代码将告诉您所讨论的节点是否为“第一个子节点”,因此应该适合您。我刚刚遇到了一个类似的问题,这对我很有效。

if($(this).prev().length)
{
    // Not first-child
} else {
    // is first-child
}

Andreas Grech 16 年前

尝试以下条件:

($parent.contents().eq(0).attr("id") === $this.attr("id"))

Community Mohan Dere 9 年前

从类似的问题开始。

How to match first child of an element only if it's not preceeded by a text node?

$("p>img").each(function () {
    var prev = this.previousSibling;
    var isThisTheFirstNode = $(this).parent().html().toUpperCase().indexOf('<IMG>') == 0;

    var method = isThisTheFirstNode ? 'before' : 'after';
    $(this).parent[method].before(this);
});

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前