Question

任何人都可以解释我为什么会这样做。我要做的是基于匹配<ul>中的<div>链接，将<a>列表树的一部分复制到另一个<li>。

它有点工作，因为它找到了<ul>树的正确部分。但它不是复制它，而是完全从原始树中提取它。

这是代码，但请参阅以下链接中的工作内容：

$(document).ready(function (e) {
  var test = "/our-services/";
  var subNav = $('#mainNav ul').find('a[href$="' + test + '"]').parent();
  $('#thing').html(subNav).wrapInner('<ul/>');
});

jsFiddle

是什么给出了？

Answer 1

您需要使用clone()方法来避免移动最初找到的节点/元素：

$(document).ready(function (e) {
    var test = "/our-services/"
        subNav = $('#mainNav ul').find('a[href$="' + test + '"]').parent().clone(true);

    $('#thing').html(subNav).wrapInner('<ul/>');
});

JS Fiddle demo

或稍微重写：

$(document).ready(function (e) {
    var test = "/our-services/",
        subNav = $('#mainNav ul').find('a[href$="' + test + '"]').parent().clone(true);

    subNav.appendTo('#thing').wrap('<ul />');
});

JS Fiddle demo

参考文献：

appendTo()。
clone()。

Answer 2

有趣的行为！它可能正在发生，因为jQuery正在做一些奇怪的事情，因为它期望将string传递给.html()方法，但是你传递了一个包装在jQuery对象中的整个dom节点。见the Jquery docs

尝试获取该节点的html内容并将其传递给.html()方法，如下所示：

$(document).ready(function (e) {
  var test = "/our-services/";
  var subNav = $('#mainNav ul').find('a[href$="' + test + '"]').parent();
  $('#thing').html(subNav.html()).wrapInner('<ul/>');
});

修改

请记住，会剥离附加到原始节点的所有数据或事件处理程序，这可能是也可能不是必需的行为，具体取决于您的实现。如果您想保留它们，请使用其他答案中所述的clone()方法，但使用clone(true)代替默认的clone(false)。

另见：

Passing an element or object to the jQuery .html() method解释为什么.html（）方法接受jQuery对象以及字符串。

jQuery提取ul树的一部分

2 个答案:

修改

另见：