Как я могу вставить элементы в Div из JavaScript? - PullRequest
Новая
       0

Как я могу вставить элементы в Div из JavaScript?

0 голосов
/ 09 сентября 2018

Это мой HTML, я беру элементы от пользователя и пытаюсь обновить в js.

Это мой файл скрипта 

  // Initializing the Stack Class
    
        function Stack() {
            this.dataStore = [];
            this.top = 0;
            this.push = push; // Inserting the element in Stack
            this.pop = pop; //Removing the element in Stack
            this.peek = peek;
            this.clear = clear;
            this.length = length;
        }
        
        // Adding an element in Stack
        function push(element) {
            this.dataStore[this.top++] = element;
        }
        
        function peek() {
            return this.dataStore[this.top - 1];
        
        }
        
        // Removing an element from the given stack
        function pop() {
            return this.dataStore[-this.top];
        }
        
        function clear() {
            this.top = 0;
        }
        
        function length() {
            return this.top;
        }
        
        var s = new Stack();
        
        function pushToStack(el){
            s.push(el);
        }
<!DOCTYPE html> 
  <html lang="en"> 
  <head> 
  <meta charset="UTF-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
  <title>Document</title> 
  </head> 
  <body> <!-- <div> <input type="text" id="stackName"> <button onclick="MakeStack()">Make a stack</button> </div> --> 
  <div> 
    <input type="text" id="elemet"> 
    <button onclick="pushToStack(document.getElementById('elemet').value)">
      Push an elemet
    </button> 
  </div> 
  <div class="container"></div>
  <script src="script.js"></script> 
  </body> 
  </html>

Я хочу, чтобы при нажатии на кнопку данные из текстового поля сохранялись в массиве как стек, а данные должны отображаться в контейнере как мой элементСтек.Спасибо за помощь.

Ответы [ 3 ]

0 голосов
/ 09 сентября 2018

добавить вход к Container, вот код. Надеюсь, это то, что вы ищете. 

// Initializing the Stack Class

    function Stack() {
        this.dataStore = [];
        this.top = 0;
        this.push = push; // Inserting the element in Stack
        this.pop = pop; //Removing the element in Stack
        this.peek = peek;
        this.clear = clear;
        this.length = length;
    }

    // Adding an element in Stack
    function push(element) {
        this.dataStore[this.top++] = element;
    }

    function peek() {
        return this.dataStore[this.top - 1];

    }

    // Removing an element from the given stack
    function pop() {
        return this.dataStore[-this.top];
    }

    function clear() {
        this.top = 0;
    }

    function length() {
        return this.top;
    }

    var s = new Stack();
    function pushContainer(el){
      //console.log(el);
      var x = document.getElementById("container");
      x.appendChild(el);
    }
    function pushToStack(el){
      //
      var newElement = document.createElement("p");
      var Textnode = document.createTextNode(el);
      newElement.appendChild(Textnode);
      pushContainer(newElement);
      
      
      s.push(el);
    }
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  
</head>
<body>
 <div>
        <input type="text" id="elemet">
        <button onclick="pushToStack(document.getElementById('elemet').value)">Push an elemet</button>
    </div>
    <div id="container">

    </div>
</body>
</html>
0 голосов
/ 09 сентября 2018

Вы можете изменить свою функцию push как: 

function pushToStack(el){
    s.push(el);
  var para = document.createElement("p");
  var node = document.createTextNode(el);
   para.appendChild(node);
   document.querySelector('.container').appendChild(para);
}

для рабочего кода, пожалуйста, обратитесь: эта ручка

0 голосов
/ 09 сентября 2018

Измените свою функцию push затем: 

function push(element) {
    this.dataStore[this.top++] = element;
    var div = document.createElement('div');
    div.textContent = element;
    document.getElementById('container').appendChild(div);
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...