Как найти все картинки на странице

• JavaScript

Всем привет! Есть простой лендинг. Хочу сделать для него админку.
Вопрос: как найти все (не только в теге img, а все)?
В php пробовал использовать регулярное выражение и найти по списку форматов, но думаю так не очень правильно, ведь формат картинок очень много и я не очень разбираюсь в регулярках в js.

• 
  Вопрос задан

  более трёх лет назад
  

• 425 просмотров

• Если вы ставите вопрос шире чем просто img, то надо уточнить, что именно вы ищите, и даже более того, что вы считаете картинкой: тэг img, background-image в css — могу понять, а что насчёт растра внутри canvas или svg? Тоже вроде как картинки.

• 

  Ankhena

  @Ankhena Куратор тега JavaScript
  

  document.getElementsByTagName('img') найдет все теги img
  document.getElementsByTagName('svg') найдет svg
  elem.style.backgroundImage проверяйте на наличие фоновой картинки, перебирая форматы, а не просто пусто или не пусто, а то туда попадут градиенты.

  С canvas… ну если бы у вас были canvs’ы вы бы не задавали такой вопрос, опустим его.

• Ankhena, не работает. Ошибка: Uncaught ReferenceError: elem is not defined

• 

  Ankhena

  @Ankhena Куратор тега JavaScript
  

  rinaz22, жестоко оно с вами..

  elem это любой элемент.
  Вам нужно написать функцию, которая будет перебирать все элементы внутри заданного (всего документа или только контентной части или где вы еще хотите поискать фон). Тогда вместо elem будет this.

  Альтернатива — фриланс

• rinaz22,

  var elemHasBGImg = [];
  document.getElementsByTagName( '*' ).forEach( function()  {
      if ( this.style.backgroundImage.test( 'url' ) )
          elemHasBGImg.push( this )
  } )

  Как-то так, не тестировал.

Минуточку внимания

function img_find() {
    var imgs = document.getElementsByTagName("img");
    var imgSrcs = [];

    for (var i = 0; i < imgs.length; i++) {
        imgSrcs.push(imgs[i].src);
    }

    return imgSrcs;
}

3

img=document.getElementsByTagName("img");
for(i=0; i<img.length; i++) {
    imgp = imgp + img[i].src + '<br/>'; 
}
document.write(imgp);

1

console.log(document.body.getElementsByTagName('img'));

1