3

Возникла проблема так как я не верно что то делаю. Я хочу обернуть каждое изображение в div с любым именем class.

К примеру:

<img src="img1.jpg" alt="">
<img src="img2.jpg" alt="">
<img src="img3.jpg" alt="">

Дальше я пишу в js вот так

let images = [...document.querySelectorAll("img")];

var wrapper = document.createElement('div');

var body = document.getElementsByTagName('body')[0];

wrapper.setAttribute('class', 'inset');

for(var i = 0; i < images.length; i++){

}

body.appendChild(wrapper);

И в итоге тег inset оборачивает все изображения а надо обернуть так

<div class="inset"><img src="img1.jpg" alt=""></div>
<div class="inset"><img src="img2.jpg" alt=""></div>
<div class="inset"><img src="img3.jpg" alt=""></div>

То есть каждое изображение в отдельный div.inset

Помогите разобраться

1 ответ 1

4

document.querySelectorAll("img").forEach(img => {
  var wrapper = document.createElement('div');
  wrapper.setAttribute('class', 'inset');
  wrapper.appendChild(img);
  document.body.appendChild(wrapper);
});
.inset {
  border: 2px inset lightgreen;
  margin:2px;
  padding:4px;
  display:inline-block;
}
<img src="img1.jpg" alt="AAA" />
<img src="img2.jpg" alt="BBB" />
<img src="img3.jpg" alt="CCC" />

8
  • 2
    document.body ? developer.mozilla.org/en-US/docs/Web/API/Document/…
    – qwabra
    11 фев 2020 в 2:54
  • это получается мне надо было в цикле создавать div, так ?
    – aast4xov
    11 фев 2020 в 2:56
  • @aast4xov да (3 символа нужно)
    – user176262
    11 фев 2020 в 3:00
  • @Igor какие три символа ?
    – aast4xov
    11 фев 2020 в 3:01
  • @aast4xov, нельзя просто взять и написать да. коментарий не пройдёт по длинет
    – qwabra
    11 фев 2020 в 3:02

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.