需要在 innerHTML 元素中将完整数组显示为字符串

Question

好的，这必须有一个简单的解决方案，但我正在打破这个问题......

我有一个 js 代码，它通过 class 从我的 HTML 中获取 ID 号。 它将所有内容存储在一个数组中。 我检查了该数组是否未定义且不为空。 到目前为止，一切都很好。

现在我需要将这个 ID 数组显示到 HTML 元素中。 完整的数组应该以逗号分隔的字符串形式出现。

相关的代码段：

    function makelink(){    
    var idArray = $(".result");
    document.getElementById("link").innerHTML = idArray;
    }
    //The result in HTML = [object Object]

当我执行以下操作时，它完全按照我的意愿工作（除了我不能将数组硬编码到这样的代码中）

    function makelink(){  
    var idArray = ["123", "124", "125", "126"];
    document.getElementById("link").innerHTML = idArray;
    }
    //The result in HTML = [123,124,125,126]

我在 Stackoverflow 上阅读了至少 4 个其他类似问题，例如[object Object] 是什么意思？ 并将javascript 数组转换为字符串，并基于我尝试过：

    document.getElementById("link").innerHTML = idArray.join();

并且：

    var idArray = $(".result");
    idArray.toString();

但我不知道如何使它适用于我的代码。 我不需要警报或 console.log。 我需要我的结果是 HTML 中的 output。 请帮忙。

Answer 1

您没有显示数组，而是 DOM 元素的 jQuery object 。 您可能需要map function。 但是这个 function 本身是不够的，你仍然需要得到结果 object 或 html 的值，但那部分是最简单的。

function makelink(){    
    var idArray = $(".result").map(function(item) { 
        return item.val(); 
    }).get();
    document.getElementById("link").innerHTML = idArray;
}

Answer 2

你可以试试这个：

function makelink(){  
  var idArray = [];
  $(".result").each(
    function(){
      idArray.push($(this).text())
    }
  );
  document.getElementById("link").innerHTML = idArray.join(', ');
}

Answer 3

做这个：：

function makelink() {  
    var idArray = ["123", "124", "125", "126"];
    document.getElementById("link").innerHTML = JSON.stringify(idArray);
}