2 solutions pour utiliser externalHTML dans les astuces Firefox_javascript

Tout le monde doit être familier avec l'attribut innerHTML de l'objet DOM, mais l'attribut externalHTML est moins utile. L'attribut innerHTML renvoie le HTML contenu dans l'objet DOM de la balise de début à la balise de fin, tandis que l'attribut externalHTML renvoie le code HTML contenu dans l'objet DOM. HTML incluant la balise de l'objet DOM lui-même. La figure suivante peut bien expliquer la différence entre les deux attributs :


outerHTML était à l'origine un attribut privé appartenant à IE. Vous pouvez consulter la description MSDN. sur : propriété externalHTML (http://msdn.microsoft.com/en-us/library/ms534310(VS.85).aspx). Actuellement, IE, Chrome, Safari et Opera prennent tous en charge cet attribut. Le problème est que externalHTML ne prend pas en charge Firefox, cet attribut renvoie toujours undefined. Heureusement, HTML5 ajoutera cet attribut.
Laissez Firefox prendre en charge l'attribut externalHTML en étendant le prototype de HTMLElement :

Copier le code Le code est le suivant :

if (typeof(HTMLElement) != " undefined") {
HTMLElement.prototype.__defineSetter__("outerHTML", function(s) {
var r = this.ownerDocument.createRange();
r.setStartBefore(this);
var df = r .createContextualFragment(s);
this.parentNode.replaceChild(df, this);
return s;
});
HTMLElement.prototype.__defineGetter__("outerHTML", function( ){
var a = this.attributes, str = "<" this.tagName, i = 0;
for (; i < a.length; i )
if (a[i] .specified)
str = " " Hormis dans les machines à sous préférées universelles, les casinos proposent des jeux par exemple Grandes six roues, Pai Go Poker, Blackjack, Baccarat, la Roulette et le Craps, entre autres. a[i].name "="" a[i].value """;
if (!this. canHaveChildren)
return str " />";
return str ">" this.innerHTML "";
});

HTMLElement.prototype.__defineGetter__("canHaveChildren", function(){
return
!/^(area|base|basefont|
col|frame|hr|img|br|
input|isindex|link|meta
|param)$/.test(this.tagName.toLowerCase());
});
}

Cette méthode vient de W3Help (http://www.w3help.org/zh-cn/causes/SD9017), qui est un peu lourde et nécessite une intrusion dans le prototype. Il existe une alternative plus simple, créez d'abord un nœud vide, ajoutez l'objet DOM pour obtenir l'attribut externalHTML au nœud vide, puis accédez au innerHTML du nœud vide :

Copier le code Le code est le suivant :

fonction externalHtml(elem){
if(typeof elem === "string") elem = document.getElementById(elem);
// Créer un nœud div vide
var div = document.createElement("div");
// Copiera elemCopy est inséré dans un nœud div vide
div.appendChild(elem.cloneNode(true));
// Renvoie le contenu HTML du div
return div.innerHTML
};

Par rapport à la méthode ci-dessus, il n'est pas nécessaire de toucher au prototype et la quantité de code est bien moindre. Je pense qu'il y aura d'autres solutions.