Изменение атрибута src на data-src в JavaScript - PullRequest
Новая
       65

Изменение атрибута src на data-src в JavaScript

0 голосов
/ 04 июля 2019

Я пытаюсь использовать ленивую загрузку для миниатюр, но проблема в том, что я не знаю, как изменить src атрибут на data-src в JavaScript.

Потому что, когда я добавил ленивый классвот так: 

class="ty-thumb-bonos lazy"

Это не работает, поэтому мне нужно также изменить атрибут src. 

else if (c.indexOf("<img") > -1) {
    var q = $c.find('img:first').attr('src').replace('s72-c','s1600');
    var k=q}else{var k=no_image}
            h += '<ul><li><div class="ty-wow"><a class="ty-thumb-bonos" href="'+u+'"><img alt="'+g+'" src="'+k+'"/><span class="tyimg-lay"/></a>

$('.ty-slide-show .HTML .widget-content div.latestposts').each(function() {
    var b = $(this).attr("data-no");
    $.ajax({
        url: "/feeds/posts/default?alt=json-in-script&max-results=" + b,
        type: 'get',
        dataType: "jsonp",
        success: function(e) {
            var u = "";
            var h = '<div class="ty-slide flexslider"><div class="slides owl-carousel">';
            for (var i = 0; i < e.feed.entry.length; i++) {
                for (var j = 0; j < e.feed.entry[i].link.length; j++) {
                    if (e.feed.entry[i].link[j].rel == "alternate") {
                        u = e.feed.entry[i].link[j].href;
                        break
                    }
                }
                var g = e.feed.entry[i].title.$t;
                var s = e.feed.entry[i].category[0].term;
                var y = e.feed.entry[i].author[0].name.$t;
                var d = e.feed.entry[i].published.$t,
                    t = d.substring(0, 4),
                    w = d.substring(5, 7),
                    f = d.substring(8, 10),
                    r = month_format[parseInt(w, 10)] + ' ' + f + ', ' + t;
                var c = e.feed.entry[i].content.$t;
                var $c = $('<div>').html(c);
                if (c.indexOf("https://www.youtube.com/embed/") > -1) {
                    var p = e.feed.entry[i].media$thumbnail.url.replace('/default.jpg', '/mqdefault.jpg');
                    var k = p
                } else if (c.indexOf("<img") > -1) {
                    var q = document.querySelectorAll('img');

q.forEach(c=> c.setAttribute('src',c.getAttribute('data-src')));
                    var k = q
                } else {
                    var k = no_image
                }
                h += '<ul><li><div class="ty-wow"><a class="ty-thumb-bonos" href="' + u + '"><img alt="' + g + '" data-src="' + k + '"/><span class="tyimg-lay"/></a><div class="ty-slide-con"><div class="ty-slide-con"><div class="ty-slide-con-tab"><h3 class="ty-bonos-entry"><a href="' + u + '">' + g + '</a></h3><a class="recent-shop" href="' + u + '"><i class="fa fa-shopping-basket"></i>SHOP NOW</a></div></div></div></div></li></ul>'
            }
            h += '</div></div>';
            $('.ty-slide-show .HTML .widget-content div.latestposts').each(function() {
                var text = $(this).attr("data-no");
                if (text == b) {
                    $(this).parent().html(h)
                }
            })
        }
    })
});

1 Ответ

1 голос
/ 04 июля 2019

Вы можете использовать setAttribute метод 

var imageElements = document.querySelectorAll('img');

imageElements.forEach(c=> c.setAttribute('src',c.getAttribute('data-src')));


var imageElements = document.querySelectorAll('img');
   
imageElements.forEach(c=> c.setAttribute('src',c.getAttribute('data-src')));
<img id='test' data-src='https://cdn4.iconfinder.com/data/icons/nature-20/512/79-512.png' />
...