jquery récupère le style css directement sur l'élément

Comment puis-je utiliser jQuery pour déterminer si un élément a un certain style défini en ligne.jquery récupère le style css directement sur l'élément

par exemple, étant donné le document

<style> 
.MyClass { position: relative } 
</style> 
... 
<div class="MyClass" id="div1" style="position: absolute"/> 
<div class="MyClass" id="div2"/> 
... 
<script> 
function f() { 
    assert($('#div1').SOMETHING('position') == 'absolute'); 
    assert($('#div2').SOMETHING('position') == ''); 
} 
</script>

Si je Css ('position'), div2 est rapporté comme étant 'relative'. Comment puis-je déterminer quels styles ont été définis en ligne?

Source

2009-09-03 erikkallen

si 'css ('position')' dit relatif, alors c'est parce qu'il est réglé sur relatif avec votre classe CSS MyClass ... div1, mais devrait être signalé comme "absolu". – peirix

@peirix: Je sais, et le rendu est correct. Cependant, je veux savoir si je l'ai mis en ligne. Et parfois, j'ai mis la position: relative en ligne, donc je dois distinguer tous ces cas. – erikkallen

Oh. Donc ce que vous demandez est s'il y a un moyen de savoir si un certain style est défini en ligne ou en utilisant le balisage CSS? Dans ce cas, je ne pense pas vraiment qu'il existe, sauf vérifier son attribut de style comme TTG suggère ci-dessous, et l'analyser pour l'information ... – peirix

Je fini par faire

assert($('#div2').get(0).style.position == 'relative');

mais je visais une place à faire de façon plus jQueryish de celui-ci.

Source

2009-09-03 12:41:04 erikkallen

Vous pourriez mettre ce code dans le sélecteur personnalisé comme décrit dans ma réponse ci-dessous –

Je pourrais, mais cela ne m'aiderait pas. Mon problème est "donné cet élément, sa position est-elle définie sur relative?", Mais faire le sélecteur personnalisé résoudrait le problème "Étant donné ces objets, lesquels d'entre eux ont leur position définie sur relative?". Cela pourrait aussi être un problème que quelqu'un doit résoudre, mais pas moi, du moins pas maintenant. – erikkallen

qu'en est-il ?
Et voici a link aux documents jQuery.

Source

2009-09-03 11:24:40

rappelez-vous que si vous utilisez 'attr ('style')' vous obtenez "position: relatif "en retour et tous les autres styles en ligne aussi bien ... – peirix

Je pourrais le faire, mais alors je devrais analyser la chaîne retournée. Je vais définir plus de styles que la position en ligne. – erikkallen

Vous pouvez créer votre propre sélecteur personnalisé:

$(document).ready(function(){ 
    $.extend($.expr[':'], { 
     positionAbsolute: positionAbsolute, 
    }); 
}); 

function positionAbsolute(el) { 
    return $(el).css("position").indexOf("absolute") >= 0; 
}

Et puis accédez à cela comme si

if ($("#MyDiv").is(":positionAbsolute")){ 
    alert("Position absolute"); 
}

Est-ce que le style doivent être en ligne? Si vous déclarez dans une classe CSS, par exemple,

.positionAbsolute{position: absolute}

et vous pouvez utiliser un selctor de classe au lieu:

if ($("#MyDiv").is(".positionAbsolute")){ 
    alert("Position absolute"); 
}

Source

2009-09-03 11:52:39

+1. Pas parce que ça a résolu mon problème, mais parce que c'est vraiment cool. Cependant, pour la raison indiquée dans la question, je ne peux pas utiliser .css ('position') – erikkallen

Je viens de recevoir un vote négatif et aucune explication. Cela m'énerve vraiment (pas le vote à la baisse, mais le manque d'explication). –

-1

Eh bien, vous pouvez simplement utiliser la méthode Css, retourne tous les styles attachés à cet élément.

Source

2009-09-03 11:56:56

J'ai dit dans la question pourquoi je ne pouvais pas faire ça. – erikkallen

jquery récupère le style css directement sur l'élément

Répondre

Questions connexes