Je veux fondamentalement appliquer un style dynamique à tous les éléments d'une page, je sais que document.all est la propriété de IE, donc, quel est l'équivalent (le cas échéant) dans DOM? Y at-il un équivalent à * in css dans DOM?Quel est l'équivalent de document.all d'IE dans DOM?
Note: Vous ne voulez pas utiliser JQuery ou tout autre JS lib pour cela, juste JS, grâce
utilisation document.getElementsByTagName('*')
The World Wide Web Consortium donne une définition claire de cette méthode (recherche getElementsByTagName).
Eh oui, je viens de tester
documentAll
document.getElementsByTagName ("*") sur Safari, Explorer6, Opera et Firefox et semble fonctionner pour tous les :)
Hmm, c'est très intéressant, j'ai toujours su que document.all est la propriété de MS IE, donc je n'ai même pas essayé de voir si cela fonctionne dans d'autres navigateurs. Je préfère toujours le faire de manière "standard", mais je pense qu'il est très intéressant que d'autres éditeurs de navigateurs l'implémentent, merci de noter ceci: –
Sorry Waleed, que c'était une faute de frappe, je voulais dire document.getElementsByTagName ("*") fonctionne sur tous les navigateurs –
Comme Scharrels dit, vous pouvez utiliser document.getElementsByTagName('*'). Mais vous devez noter que l'application de styles à chaque élément d'une page aura un impact sur les performances. Il serait préférable de créer dynamiquement un <style> tag et ajoutez les styles là-bas:
function addStyles(styles) {
var styleTag = document.createElement('style');
styleTag.type = 'text/css';
try {
styleTag.appendChild(document.createTextNode(styles));
} catch(e) {
/* Exception thrown in IE */
styleTag.stylesheet.cssText = styles;
}
document.getElementsByTagName('head')[0].appendChild(styleTag);
return styleTag;
}
Utilisation:
addStyles('* { color: red; }');
Oh, en fait, je ne l'utilise que pour un bookmarklet. Je crée un bookmarklet pour google Chrome afin de modifier les couleurs d'arrière-plan et de texte, donc ce n'est pas un problème si cela affecte les performances, mais merci de le noter quand même. –
Application d'un style à tous les éléments n'est pas quelque chose que vous feriez normalement, Alors, qu'est-ce que vous allez utiliser pour?
Il existe des styles que vous ne pouvez pas appliquer à tous les éléments. Par exemple, un élément select ne prend pas en charge la définition de bordures dans tous les navigateurs. La définition de la marge sur les éléments en ligne peut avoir des résultats inattendus variables ...
Certains styles sont hérités, donc si vous appliquez par exemple une taille de police à l'élément body, cela serait hérité par des éléments qui ne l'ont pas déjà un ensemble de taille de police spécifique.
Vous pouvez utiliser la cascade en CSS pour modifier le style sur de nombreux éléments. Si par exemple vous avez ce style défini:
.highlight div.info { background: #ffc; }
.highlight strong { color: #f00; }
Réglage className = « highlight » à la balise body serait donner à chaque div intérieur avec class = « info » un fond jaune clair et chaque élément fort rouge.
Merci beaucoup .. –