用jQuery包装元素

Question

我在jQuery中使用AJAX来获取一些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());
}