JS: удалить атрибуты в конкретном <></>

185

18 марта 2018, 23:02

Изображение содержит атрибут class, который подставляется CMS.

<img alt="" class="fill-content replaced-content" src="/image.jpg">

Подскажите способ удаления атрибута class="fill-content replaced-content" чтобы тег выглядел вот так: <img alt="" src="/image.jpg">

Мой первый способ:

var imgRemoveClass = document.querySelectorAll("img");
    if (imgRemoveClass.hasAttribute("class")) {
        imgRemoveClass.removeAttribute("class");
    }

выдает ошибку:

Uncaught TypeError: imgRemoveClass.hasAttribute is not a function

Мой второй способ:

var imgRemoveClass = document.querySelector("img");
    if (imgRemoveClass.hasAttribute("class")) {
        imgRemoveClass.removeAttribute("class");
    }

в консоли срабатывет, но при загрузке со страницы:

Uncaught TypeError: imgRemoveClass.hasAttribute is not a function

Answer 1

в первом случае imgRemoveClass - это массив. Чтобы удалить класс, необходимо указать индекс элемента в этом массиве. Например, imgRemoveClass[0].removeAttribute("class"); Либо же циклом.

Во втором случае, сложно сказать. Возможно скрипт загружается раньше, чем разметка. Также, может быть, что где-то буква e, a и тп. написана в кириллической раскладке Попробуйте обратиться через id, например.

Answer 2

Благодаря ответу Дмытрык догодался о том что мой скрипт:

var imgRemoveClass = document.querySelector("img");
    if (imgRemoveClass.hasAttribute("class")) {
        imgRemoveClass.removeAttribute("class");
    }

тестируется в консоли уже на загруженной странице, тоесть DOM уже построен. В случае добавления скрипта на страницу, скрипт выполняется раньше чем построен DOM, поэтому никаких атрибутов еще не существует и мы получаем ошибку.

Решение:

window.onload = function() {
var imgRemoveClass = document.querySelector("img");
        if (imgRemoveClass.hasAttribute("class")) {
            imgRemoveClass.removeAttribute("class");
        }
}

теперь скрипт исполняется только после полной загрузки документа и работает по назначению.