Question

我过去从这个网站获得了很好的结果（阅读：昨天），这里的贡献者创建了这个：http://jsbin.com/awerep/1/edit。现在我想使用第一个选项卡使当前选中的选项卡交换位置。我很难理解如何使用Jquery和Javascripts以及第一个孩子的选择器。我将通过克隆第一个菜单项，将其放在单击的菜单项之前，并用所单击的菜单项替换第一个菜单项来交换菜单项。我想我可以使用jquery的this-child选择器来确定包装器的当前第一个子节点。但是，如果元素的位置动态变化（由于替换），它是否动态地更新第一个孩子的内容。或者第一个孩子仍然是元素1？

编辑：感谢大家的帮助。这就是我的目标（成为第一个按照我的意图实际工作的人）：http://jsbin.com/olojok/1

Answer 1

（在jQuery中）This将始终是当前选定的元素。如果您希望从您选择的多个元素中选择第一个元素，只需执行$('.elements')[0]或$('.elements:first-child')或$('.elements:nth-child(1)')

Answer 2

每当你移动一个现有的元素时，它就会从DOM中分离并重新插入到正确的位置，因此你不需要克隆任何元素。

您可以使用.siblings().first()查找当前元素的第一个兄弟，并使用.insertBefore将该元素移动到当前元素前面。

然后，您可以使用.prependTo()将当前元素移动到列表中的第一个位置。

function swapWithFirst(el) {
    var $el = $(el);
    $el.siblings().first().insertBefore(el);
    $el.prependTo(el.parentNode);
}

如果父级中没有包含文本节点，则中间行可以替换为：

$el.before(el.parentNode.firstChild);

Answer 3

如果您想将所选标签移至第一位，请将此代码添加到.click()

$(this).prependTo($(this).parent());

编辑：如果您想要交换2标签

var $firstTab = $('.menuitem:first');
var $clickedTab = $(this);

$firstTab.insertAfter($clickedTab);
$clickedTab.prependTo($clickedTab.parent());

用jquery / javascript找到元素的CURRENT第一个子元素？

3 个答案: