我如何将js数组打印到html的div中？ [关闭]

Question

关闭。这个问题是not reproducible or was caused by typos。它当前不接受答案。

---

是否要改善此问题？ Update the question，因此堆栈溢出为on-topic。

[<8天前关闭。

为什么我不能显示推送到数组，html div中的元素。我只是试图打印单词hello 3次，但它不起作用。当我将阵列打印到控制台时，该阵列确实显示3个Hello。

$(function() {
  var $buttonsArray = [];
  var $buttondiv = $('#btndiv');

  for (var i = 0; i < 3; i++) {
    var $button = "hello";
    $buttonsArray.push($button);
  }

  for (var j = 0; j < $buttonsArray.length; j++) {
    $buttondiv.append($buttonsArray[j]);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="btndiv"></div>

Answer 1

HTML主要是文本（或称其为字符串），而javascript变量可以是字符串，数字，对象，数组。

默认情况下，在所有这些javascript类型上，如果仅将它们放入DOM元素中，浏览器就会尝试将它们转换为字符串。

const someNumber = 1
const someString = 'hello'
const someObject = {answer:42}
const someArray = [1, 'help', 3, {a:2}]

document.write(someNumber + '<br/ >')
document.write(someString + '<br/ >')
document.write(someObject + '<br/ >')
document.write(someArray + '<br/ >')

// is the same as 
document.write(someNumber.toString() + '<br/ >')
document.write(someString.toString() + '<br/ >')
document.write(someObject.toString() + '<br/ >')
document.write(someArray.toString() + '<br/ >')

处理数组时，可以使用.join重新组合它们
例如
 
const greets = ['allo', 'hello', 'holla'];

function render() {  
  // This write the list separated with comas using join
  document.getElementById('app').innerHTML = greets.join(', ');
  
  // This works too but can be slow and doesn't not allow much flexibility
  document.getElementById('debug').innerHTML = JSON.stringify(greets);
}

render();

setTimeout(() => {
  greets.push('oi');
  render();
}, 1000)
<div id="app"></div>
<pre id="debug"></pre>