jQuery – Modifier des éléments

Modifier un attribut

Exemple: remplacer une image par une autre en changeant l’attribut src

HTML


<img id="img" src="https://michelpiallier.info/blog/ressources/fleurs/fleur1.jpg" alt="fleur1" width="150">
<button id="bt2">Fleur 2</button>
<button id="bt3">Fleur 3</button>
<button id="bt1">Fleur 1</button>



<img id="img" src="https://michelpiallier.info/blog/ressources/fleurs/fleur1.jpg" alt="fleur1" width="150">

<button id="bt2">Fleur 2</button>

<button id="bt3">Fleur 3</button>

<button id="bt1">Fleur 1</button>

Javascript


$("#bt2").on("click",function(){
		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur2.jpg");
})
$("#bt3").on("click",function(){
		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur3.jpg");
})
$("#bt1").on("click",function(){
		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur1.jpg");
})



$("#bt2").on("click",function(){

		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur2.jpg");

})

$("#bt3").on("click",function(){

		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur3.jpg");

})

$("#bt1").on("click",function(){

		$("#img").attr("src","https://michelpiallier.info/blog/ressources/fleurs/fleur1.jpg");

})

Jsfiddle

Publier 2 mai 2014 par Michel PIALLIER dans jQuery - Modifier des éléments Commentaires fermés

Modifier le style du premier caractère d’une chaine

HTML


<h1 id="titre">Le ciel est bleu aujourd'hui</h1>

CSS


.green {
    color:green ;
}

jQuery


var elemh1=$("#titre").text();
var premiercar=elemh1.charAt(0);
var resth1=elemh1.slice(1);
$("#titre").html('<h1 id="titre"><span class="green">' + premiercar + '</span>' + resth1 + '</h1>');



var elemh1=$("#titre").text();

var premiercar=elemh1.charAt(0);

var resth1=elemh1.slice(1);

$("#titre").html('<h1 id="titre"><span class="green">' + premiercar + '</span>' + resth1 + '</h1>');

Jsfiddle

Publier 3 décembre 2015 par Michel PIALLIER dans jQuery - Modifier des éléments Laisser un commentaire

Javascript

« Previous 1 2

[an error occurred while processing this directive]