web-dev-qa-db-fra.com

JavaScript change img src attribut sans jQuery

Comment changer l'attribut src d'une HTMLImageElement en JavaScript?

J'ai besoin d'aide pour convertir logo.attr('src','img/rm2.png') en JavaScript vanille.

window.onresize = window.onload = function () {
    if (window.innerWidth > 1536) {
        var logo = document.getElementById('rm');
        logo.attr('src','img/rm2.png');
    }
};
javascriptimagesrc
8
technopeasant

Vous voulez dire que vous voulez utiliser du javascript pur?

Cela devrait le faire:

var logo = document.getElementById('rm');
logo.src = "img/rm2.png";

Donc, votre fonction devrait ressembler à:

window.onresize = window.onload = function () {
    if (window.innerWidth > 1536) {
      var logo = document.getElementById('rm');
      logo.src = "img/rm2.png";
    }
};

Note : Vous pouvez aussi utiliser element.setAttribute . MAIS, voir ce post pour plus:
Quand utiliser setAttribute vs .attribute = en JavaScript?

22
gideon

essayez ceci ... espérons que cela fonctionne

window.onresize = window.onload = function () {
    if (window.innerWidth > 1536) {
        var logo = document.getElementById('rm');
        logo.setAttribute('src','img/rm2.png');
    }
};
1
Tejasva Dhyani

Je pense que c'est juste logo.src = "img/rm2.png".

0
dbrin
var logo = document.getElementById('rm');
logo.setAttribute('src', 'img/rm2.png');
0
Aaron

Puisque vous dites que vous voulez faire cela à différents endroits du programme, je créerais une fonction comme celle-ci:

function ChangeImage(image_id,path)
{
  document.images[image_id].src = path
}
0
Nobita

Donc, si vous voulez vérifier si la taille a changé, puis changez de nouveau le code de vérification ci-dessous.

window.onresize = window.onload = function () {
    if (window.innerWidth < 768) {

      var logo = document.getElementById('changeLeft');
      logo.src = "MobileImage.png";

    }else{

 var logo = document.getElementById('changeLeft');
      logo.src = "DesktopImage.png";

    }
};

Ajustez window.innerWidth pour décider de vos points de rupture. J'espère que cela pourra aider.

0
Sabba Keynejad