@DivineDraft

Как обернуть картинку нужным кодом?

Идет конструкция:
<div class="news-full-text">
текст
<img src="#" свойств и тд>
текст
<img src="#" свойств и тд>
текст
</div>


Каким образом можно обратиться к .news-full-text img и обернуть каждую из картинок примерным кодом, чтобы получилось вокруг img:
<div class="image">
    <img src="картинка">
    <div class="image-social">социальные кнопки</div>
</div>


Благодарим любим примерам или мыслям.
  • Вопрос задан
  • 86 просмотров
Решения вопроса 2
0xD34F
@0xD34F Куратор тега JavaScript
$('.news-full-text img')
  .wrap('<div class="image"></div>')
  .after('<div class="image-social">социальные кнопки</div>');

или

$('.news-full-text img').replaceWith(function() {
  return `
    <div class="image">
      ${this.outerHTML}
      <div class="image-social">социальные кнопки</div>
    </div>`;
});

или

$('.news-full-text').html((i, html) => html.replace(/<img .*?>/g, m => `
  <div class="image">
    ${m}
    <div class="image-social">социальные кнопки</div>
  </div>
`));
Ответ написан
kreotech
@kreotech
Абстрактно-ориентированный программист
Это можно сделать используя метод .wrap()
Набросал пример.
Картинки не отображаются, так как в коде не заданы адреса. Смотреть через инструменты разработчика.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы