Отображение элементов массива на элементе div нажатием кнопки с использованием vanilla javascript - PullRequest
Новая
       0

Отображение элементов массива на элементе div нажатием кнопки с использованием vanilla javascript

0 голосов
/ 14 февраля 2020

Может кто-нибудь подскажите, пожалуйста, как можно распечатать массив элементов на элементе div 

var myArray=["stone","paper","scissors"]


<button onclick="printnumbers()"></button>
<div id="result">

</div>

Ответы [ 5 ]

3 голосов
/ 14 февраля 2020 

var myArray = ["stone", "paper", "scissors"]
function printnumbers() {
  document.querySelector('#result').textContent = myArray.join(', ');
}
<button onclick="printnumbers()">Print Numbers</button>
<div id="result"></div>
2 голосов
/ 14 февраля 2020

Используйте метод .toString(). 

function printnumbers(){
var myArray=["stone","paper","scissors"]
var display = myArray.toString();
document.getElementById("result").innerHTML = display;
}
<button onclick="printnumbers()">Display</button>
<div id="result"></div>
0 голосов
/ 14 февраля 2020

С Vanilla. * Только 1011 *, это должно помочь вам:) 

const myArray = ["stone", "paper", "scissors"];

const el = document.getElementById('myButton');

el.addEventListener('click', function() {
  const div = document.getElementById("result");
  myArray.forEach((currentValue, index, array) => {
    let text = index == (array.length - 1) ? `${currentValue}` : `${currentValue}, `;
    let content = document.createTextNode(text);
    div.appendChild(content)
  });
}, false);
#result{
  width: 20rem;
  height: 1rem;
  margin-top: 2rem;
  border-width:3px;
  border-style:dashed;
  border-color:#FFAC55;
  padding: 15px 20px;
}
<!DOCTYPE html>
<html>

<body>

    <button id="myButton">Try it</button>
    <div id="result"></div>

</body>

</html>
0 голосов
/ 14 февраля 2020 
var myArray=["stone","paper","scissors"]

printNumbers = () => {
   document.getElementById('result').innerHTML = myArray.join(' ');
}
0 голосов
/ 14 февраля 2020

Просто сделайте forEach над вашим массивом myArray и добавьте текст внутри div. 

var myArray=["stone","paper","scissors"]
function printnumbers(){
   myArray.forEach(function(el){
     document.getElementById('result').innerHTML+='<br>' +el;
   })
}
// alternative way , suited for your use case.
//var arrayContents = myArray.toString();
//document.getElementById('result').innerHTML = arrayContents;
<button onclick="printnumbers()" >click me</button>
<div id="result">

</div>

Метод toString() возвращает строку со всеми значениями массива, разделенными запятыми, вы также можете использовать этот метод.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...