Javascript. Методы перемещения по DOM-дереву. Практическое задание 2.10.
В скрипте объявлена переменная const values = ["велосипед", "ролики", "лыжи"];, которая содержит массив из строк. В HTML-верстке есть два тега <div> с классами div1 и div2. Допишите скрипт так, чтобы все теги <p> из тега с идентификатором div1, значение которого встречается в списке values, переместились в тег с идентификатором div2.
<section class="card">
<div id="div1">
<p>велосипед</p>
<p>лыжи</p>
<p>скейт</p>
</div>
<div id="div2"></div>
</section>
Пример значений:
values = ["велосипед", "ролики", "лыжи"]
Пример заданного HTML-документа:
<div id="div1"><p>велосипед</p><p>лыжи</p><p>скейт</p></div>
<div id="div2"></div>
Пример результата в HTML-документе:
<div id="div1"><p>скейт</p></div>
<div id="div2"><p>велосипед</p><p>лыжи</p></div>
По дате
По рейтингу
123456789101112
const values = ["велосипед", "ролики", "лыжи"];
const div1 = document.getElementById("div1");
const div2 = document.getElementById("div2");
const pTags = div1.getElementsByTagName("p");
for (let i = pTags.length - 1; i >= 0; i--) {
if (values.includes(pTags[i].textContent)) {
div2.appendChild(pTags[i]);
}
}
123456789101112131415161718192021222324252627
<!DOCTYPE html>
<html>
<head>
<script>
const values = ["велосипед", "ролики", "лыжи"];
const div1 = document.getElementById("div1");
const div2 = document.getElementById("div2");
const pTags = div1.getElementsByTagName("p");
for (let i = pTags.length - 1; i >= 0; i--) {
if (values.includes(pTags[i].textContent)) {
div2.appendChild(pTags[i]);
}
}
</script>
</head>
<body>
<div id="div1">
<p>велосипед</p>
<p>лыжи</p>
<p>скейт</p>
</div>
<div id="div2"></div>
</body>
</html>
Больше по теме