Как перезаписать значение атрибута на JS

Question

Мне нужно перезаписывать значения атрибута src для дальнейшей работы с тегом img, значение записывается как временное и когда мне надо извлечь потом новое значение src я в итоге ничего не получаю.

    var author_track = obj.querySelector('.track-name');
    var img = obj.querySelector('img');
    if (author_track) {
        var name = author_track.innerHTML.match(/(.+)\s+-\s+.+/);
        $.ajax({
            url: '/serializers/AlbumAudioTrack/',
            type: 'GET',
            data: {
                author_track: name[1]
            },
            success: function (album) {
                if (album[0]) {
                    img.src = album[0].photo;
                } else {
                    img.removeAttribute('src');
                    img.setAttribute('src', '/media/user_16131596871613159687/photo/AlbumDefault.jpg');
                }
            }
        });
    }
    console.log(img.src);

Есть решение данной проблемы?

Answer 1

А так не вариант?

var author_track = obj.querySelector('.track-name');
    var img = obj.querySelector('img');
    if (author_track) {
        var name = author_track.innerHTML.match(/(.+)\s+-\s+.+/);
        $.ajax({
            url: '/serializers/AlbumAudioTrack/',
            async: false, 
            type: 'GET',
            data: {
                author_track: name[1]
            },
            success: function (album) {
                if (album[0]) {
                    img.src = album[0].photo;
                } else {
                    img.src = '/media/user_16131596871613159687/photo/AlbumDefault.jpg';
                }
            }
        });
    }
    console.log(img.src);

Изменил сделал запрос синхронным, раз вы не можете обрабатывать асинхронные запросы

А через асинхронный так нужно проверять

var author_track = obj.querySelector('.track-name');
var img = obj.querySelector('img');
if (author_track) {
    var name = author_track.innerHTML.match(/(.+)\s+-\s+.+/);
    $.ajax({
        url: '/serializers/AlbumAudioTrack/',
        type: 'GET',
        data: {
            author_track: name[1]
        },
        success: function (album) {
            if (album[0]) {
                img.src = album[0].photo;
            } else {
                img.src = '/media/user_16131596871613159687/photo/AlbumDefault.jpg';
            }
            console.log(img.src);
        }
    });
}

Answer 2

Вся причина в том, что console.log(img.src) выполняется до того, как выполнится запрос ajax(), так как это асинхронный запрос. Вы можете использовать метод then(), чтобы решить проблему.

var author_track = obj.querySelector('.track-name');
var img = obj.querySelector('img');
if (author_track) {
    var name = author_track.innerHTML.match(/(.+)\s+-\s+.+/);
    $.ajax({
        url: '/serializers/AlbumAudioTrack/',
        type: 'GET',
        data: {
            author_track: name[1]
        },
        success: function (album) {
            if (album[0]) {
                img.src = album[0].photo;
            } else {
                img.removeAttribute('src');
                img.setAttribute('src', '/media/user_16131596871613159687/photo/AlbumDefault.jpg');
            }
        }
    }).then(function(){
        console.log(img.src);
    });
}

БЛОГ НА HUSL

Как перезаписать значение атрибута на JS

Ответы (2 шт):