Explication détaillée de la façon d'ajouter des styles aux éléments avec jQuery_jquery

L'exemple de cet article décrit comment ajouter des styles aux éléments avec jQuery. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

1. Obtenez et définissez des styles

$("#tow").attr("class")//获取ID为tow的class属性
$("#two").attr("class","divClass")//设置Id为two的class属性。

2. Ajouter des styles

Copier le code Le code est le suivant :

$("#two").addClass("divClass2")/ /est l'ID Ajouter le style divClass2

à l'objet de deux

3. Supprimer les styles

$("#two").removeClass("divClass")//移除 ID为two的对象的class名为divClass的样式。
$(#two).removeClass("divClass divClass2")//移除多个样式。

4. Changer de nom de classe

Copier le code Le code est le suivant :

$("#two").toggleClass("anotherClass") / / Répétez le changement d'un autre style de classe

5. Déterminez si un certain style est inclus

Copier le code Le code est le suivant :

$("#two").hasClass("another")= =$( "#deux").is(".un autre");

6. Obtenez le style en style CSS

Copier le code Le code est le suivant :

$("div").css("color")// Définissez la valeur de l'attribut de couleur $(element).css(style)

.

Définir un style unique

Copier le code Le code est le suivant :

$("div").css("color","red ")

Définissez plusieurs styles

$("div").css({fontSize:"30px",color:"red"})
$("div").css("height","30px")==$("div").height("30px")
$("div").css("width","30px")==$("div").height("30px")

Méthode 7.offset()

Sa fonction est d'obtenir le décalage relatif de l'élément dans la fenêtre de vue actuelle, où l'objet renvoyé contient deux attributs, à savoir top et left.

Remarque : Valable uniquement pour les éléments visibles.

var offset=$("div").offset();
var left=offset.left; //获取左偏移
var top=offset.top; //获取右偏移

8. méthode position()

Sa fonction est d'obtenir le décalage relatif de l'élément par rapport au nœud grand-parent le plus proche dont l'attribut de style de position est défini sur relatif ou absolu, comme offset(), l'objet qu'il renvoie comprend également deux attributs, top et left.

9. Méthode scrollTop() et méthode scrollLeft()

$("div").scrollTop(); //获取元素的滚动条距顶端的距离。
$("div").scrollLeft(); //获取元素的滚动条距左侧的距离。

10. Les méthodes toggle et slideToggle dans jQuery peuvent à la fois afficher et masquer un élément. La différence est :

basculer : l'effet dynamique s'effectue de droite à gauche. Mouvements latéraux.
slideToggle : effet dynamique de bas en haut. Action verticale.

Par exemple, si vous souhaitez obtenir un effet dynamique d'un arbre rétrécissant de bas en haut, utilisez simplement slideToggle.

$('input').attr("readonly",true)//将input元素设置为readonly
$('input').attr("readonly",false)//去除input元素的readonly属性
$('input').attr("disabled",true)//将input元素设置为disabled
$('input').attr("disabled",false)//去除input元素的disabled属性

J'espère que cet article sera utile à tous ceux qui programment jQuery.