установите img data-srcset через javascript, если useragent равно iOS, не работает

Question

Поскольку браузер Safari не поддерживает изображения .webp, мне нужно создать запасной вариант, поэтому, если значение useragent равно iOS, загрузите .jpg вместо .webp. У меня есть img на фигуре, подобной этой:

, способ ошибки не работает. Итак, что я тоже попробовал сейчас:

<script>
let iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
let parallaximg1 = document.getElementById('parallax-img-1');
if (iOS) {
    alert("ios!");
    parallaximg1.srcset = "assets/demo/misc/parallax-img-1.jpg";
}
</script>

Это тоже не работает. Изображение существует, и срабатывает функция alert (). Что я делаю неправильно? Что я могу сделать, чтобы иметь запасной вариант для iPhone пользователей, которые не могут загружать изображения .webp?

Answer 1

Исправлено с помощью средства проверки modernizr webp:

let parallax_img_1 = document.getElementById('parallax-img-1');
Modernizr.on('webp', function (result) {
// `result == Modernizr.webp`
console.log(result);  // either `true` or `false`
if (result) {
    // all good
}
else {

    parallax_img_1.setAttribute('data-srcset', 'assets/demo/misc/parallax-img-1.jpg');
}
});