Отображать всплывающее окно SweetAlert, если на странице НЕ существует Div-класса - PullRequest
Новая
       18

Отображать всплывающее окно SweetAlert, если на странице НЕ существует Div-класса

0 голосов
/ 21 мая 2019

Я пытаюсь отобразить всплывающее окно SweetAlert, если div-класс НЕ находится на странице, похоже, он работает с идентификатором, но не с классами.

Может ли кто-нибудь помочь в этом всплывающем окне, если div-класс неприсутствует на странице? 

<div class="box">
    <img id="mainimage" src="image.jpg">
</div>

https://sweetalert2.github.io/

CDN https://cdn.jsdelivr.net/npm/sweetalert2@8

WORKING (у нас есть идентификатор, называемый mainimage, и всплывающее окно не отображается. КогдаЯ изменяю на mainimage, он показывает всплывающее окно, как и должно) 

if (!document.getElementById("mainimage")) {
    Swal.fire({
        title: 'Rick Astley',
        html: '<iframe width="100%" height="300" src="//www.youtube.com/embed/dQw4w9WgXcQ?wmode=transparent&amp;iv_load_policy=3&amp;autoplay=0" frameborder="0"></iframe>'
    });
};

Когда я пытаюсь проверить, присутствует ли исключенное имя класса (carrd), оно, похоже, не работает или если оно изменено наdiv на странице 

if (!document.getElementsByClassName("carrd")) {
    Swal.fire({
        title: 'Rick Astley',
        html: '<iframe width="100%" height="300" src="//www.youtube.com/embed/dQw4w9WgXcQ?wmode=transparent&amp;iv_load_policy=3&amp;autoplay=0" frameborder="0"></iframe>'
    });
};

Ответы [ 2 ]

4 голосов
/ 21 мая 2019

Проверьте свойство length из результата этой функции. 

if (document.getElementsByClassName("carrd").length === 0) {
    Swal.fire({
        title: 'Rick Astley',
        html: '<iframe width="100%" height="300" src="//www.youtube.com/embed/dQw4w9WgXcQ?wmode=transparent&amp;iv_load_policy=3&amp;autoplay=0" frameborder="0"></iframe>'
    });
};

Объяснение: getElementsByClassName всегда возвращает коллекцию HTML, и поэтому она не будет работать так, как вы ожидаетеэто с помощью оператора !

Работает с функцией getElementById , поскольку она возвращает найденный элемент, или null , если элементы не найдены.

1 голос
/ 21 мая 2019 
document.getElementsByClassName("carrd")

возвращает массив элементов, имеющих этот класс carrd. Перейти с кодом ниже. 

if(document.getElementsByClassName("carrd").length === 0)
...