javascript - 加入数组会导致将它们作为对象加入

Question

我有一个items包含数组的参数的回调：

[<article>..</article>,<article>...</article>,<article>..</article>]

我需要做的是加入这些项目，所以我所做的是：

items = items.join('');

但是当我console.log(items)看到：

[object HTMLElement][object HTMLElement][object HTMLElement][object HTMLElement] 

如何正确合并此数组？

Answer 1

你有对象，它们不能用join().

如果您的浏览器支持outerHTML，您可以...

var html = $.map(items, function(item) { return item.outerHTML; }).join("");

js小提琴。

否则，你可以这样做...

var fauxDocFrag = $("<div />");
$.each(items, function(key, item) { fauxDocFrag.append(item); });
var html = fauxDocFrag.html();

js小提琴。

Answer 2

在这里，我已经为上述问题完成了完整的垃圾箱。你可以通过演示链接。

演示 http://codebins.com/bin/4ldqp7n HTML

<input type="button" id="btn1" value="Get Object Array Text" />
<input type="button" id="btn2" value="Reset" />
<div id="result">
</div>

jQuery

$(function() {
    var items = ["<article>Article-1:Text</article>", "<article>Article-2:Text</article>", "<article>Article-3:Text</article>", "<article>Article-4:Text</article>", "<article>Article-5:Text</article>"];

    $("#btn1").click(function() {
        var result = "";
        $.each(items, function(key, item) {
            if ($(item).text().trim() != "") {
                if (key > 0) result += " ";
                result += $(item).text().trim();
            }
        });
        if (result != "") {
            $("#result").html(result);
            $("#result").show('slow');
        }
    });

    //Reset Result
    $("#btn2").click(function() {
        $("#result").html('').css('display', 'none');
    });
});

演示 http://codebins.com/bin/4ldqp7n