как сделать функцию, которая будет принимать ссылку на DOM объект?

Сделайте функцию appendElem, которая первым параметром будет принимать ссылку на DOM объект, в котором лежит тег ul, а вторым - текст. Сделайте так, чтобы данная функция создавала новую li с переданным текстом и добавляла ее в конец переданного тега ul. */ не получается заполучить ссылку на dom объект, подскажите, что я неправильно делаю? первый раз сталкиваюсь с подобными функциями

let ul = document.getElementById("list");
function appendElem(elems, text) {
  for (let elem of elems) {
    let li = document.createElement("li");
     li.textContent = text;
    elem.textContent += li;
     ul.innerHTML = li;
  }
}

console.log(appendElem(li, "text"));
console.log(elems);
    <ul id="list">
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>


Ответы (1 шт):

Автор решения: Алексей Шиманский

что я неправильно делаю

Много чего. Пунктов 5-6 точно наберётся

  1. Надо передать ссылку на ul, а вы передается на li. Причём которого не объявлено в коде
  2. Цикл не прокатит, т.к. если передать ссылку на один элемент DOM, то, логично, никаких итераций у него нет
  3. Передаёте в функцию elems, но при этом пытаетесь обратиться к ul, которого нет в данной функции
  4. Зачем вообще цикл, если нужно сделать добавление элемента в конец?
  5. зачем вот это elem.textContent += li? если по условию нет надобности заменять текст в других li
  6. console.log(elems); - что вы хотели увидеть, если у вас elems внутри функции?

let ul = document.getElementById("list");

function appendElem(ul, text) {
  let li = document.createElement("li");
  li.textContent = text;
  ul.appendChild(li);
}

appendElem(ul, "text")
appendElem(ul, "hello")
appendElem(ul, "yo")
<ul id="list">
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

→ Ссылка