Я не могу захватить несколько форм и список JavaScript

Question

У меня проблемы с выполнением функции в javascript, как будто она берет данные формы и перечисляет их ниже. Я делаю это следующим образом

<code><pre>

> function changeText2 () {
>         var assembly = ['staff', 'description']
>         var node = document.createElement ("LI");
>         var textnode = document.createTextNode (assembly);
>         node.appendChild (textnode);

 document.getElementById ("demo"). appendChild (node);
     

только она возвращает только идентификаторы"штат" и "описание"

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

только с несколькими кампусами

Answer 1

Измените это на что-то вроде этого ниже. Не забудьте изменить HTML соответствующим образом, как написано в ссылке JSfiddle

const list = document.getElementById('demo');

  const changeText2= () => {
         let staff = document.getElementById('staff').value;
         let desc = document.getElementById('desc').value;

         let node = document.createElement ("LI");
         let textnode = document.createTextNode(`${staff}, ${desc}`);
         node.appendChild (textnode);
 document.getElementById ("demo"). appendChild (node);

}

https://jsfiddle.net/1gjs789f/

Чтобы расширить свой код, сначала вы не указали, хотите ли вы, чтобы входные данные были взяты изполя, указанные в HTML DOM. Вы делаете это путем отдельного вызова getElementById для определенных полей (в данном случае 'staff' и 'desc', как в вашем примере кода) и вызова функции .value для них, чтобы получить значение из полей.

После этого настройте текст, который будет отображаться внутри элемента LI.

Использование `` и $ {} конструкций ES6, как в моем примере, довольно просто, но вы также можете использовать приведенный ниже пример, если вам проще. Я могу утверждать, что это действительно проще для глаз, хотя я предпочитаю ES6.

let textnode = document.createTextNode(staff + ", " + desc);

Наконец, добавьте текстовый узел, затем добавьте элемент li. Готово.