Дана ссылка, абзац и кнопка. По нажатию на кнопку запишите href ссылки в текст абзаца

Question

Необходимо, чтобы по нажатию кнопки в абзац добавлялись все ссылки, а не одна, как сейчас

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Test</title>
  </head>
  <body>
    <a  id="am" href="url1.html">url1</a><br />
    <a id="am2" href="url2.html">url2</a><br />
    <p id="test_p"></p>
    <button id="button">Вычислить</button>
    <script>
      document
        .getElementById("button")
        .addEventListener("click", function () {
          href = document.getElementById("am").getAttribute("href");
          p = document.getElementById("test_p");
          p.innerHTML = href;
        });
    </script>
  </body>
</html>

Я пробовал варианты с forof и for, но у меня ничего не вышло(

Answer 1

let p = document.getElementById("test_p");

document.getElementById("button").addEventListener("click", () => {
    let allHrefs = [];
    
    document.querySelectorAll("a").forEach(el => {
        allHrefs.push(el.getAttribute("href"));
    });
    
    p.innerHTML = allHrefs.join(', ');
});

<a id="am" href="url1.html">url1</a><br />
<a id="am2" href="url2.html">url2</a><br />
<p id="test_p"></p>
<button id="button">Вычислить</button>

БЛОГ НА HUSL

Дана ссылка, абзац и кнопка. По нажатию на кнопку запишите href ссылки в текст абзаца

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