javascript - 用 jQuery 包裹元素

Question

我使用 AJAX 和 jQuery 来获取一些 html 内容，这里是成功函数：

function successFn(data) {

    var keyWord = $("#input").val();

    // convert string html to object
    var anchors = $('<div/>').html(data).contents();

    // add data-keyword to all results
    anchors.each( function (i) {
        $(this).attr('data-keyword', keyWord);
        $(this).wrap('<div class="xXx"></div>');
    });

    // print results
    $("#results").html(anchors);
}

包含一个data锚点列表：

<a href="link">...children...</a>
<a href="link">...children...</a>
<a href="link">...children...</a>
<a href="link">...children...</a>

所以我正在尝试向这些链接添加一个属性，这是有效的然后我用一个 div 包装每个锚点，这是无效的。

为什么不包起来？

Answer 1

问题是您只添加了锚元素，不包括您包装的内容。

function successFn(data) {

    var keyWord = $("#input").val();

    // convert string html to object
    var wrapper = $('<div/>').html(data);
    var anchors = wrapper.contents();

    // add data-keyword to all results
    anchors.each( function (i) {
        $(this).attr('data-keyword', keyWord);
        $(this).wrap('<div class="xXx"></div>');
    });

    // print results
    $("#results").empty().append(wrapper.contents());
}