1
votes

Créer un nœud d'élément, définir ses attributs et ajouter l'élément?

On me demande de créer un nœud d'élément pour l'élément link et de définir son attribut rel sur "styleSheet", son attribut id sur "fancySheet" et son href attribut à "na_style_num.css" (où num est la valeur de la variable styleNum).

Il veut ensuite que j'ajoute l'élément de style fancySheet à l'en-tête du document.

J'ai l'impression d'être vraiment proche ou très loin d'ici. Voici ce que j'ai tenté sans chance:

na_styler.js:

window.addEventListener("load", setStyles);

function setStyles() {
   var styleNum = randInt(5);
   var styleNum = document.createElement("link");
   styleNum.setAttribute("rel", "stylesheet");
   styleNum.setAttribute("id", "fancySheet");
   styleNum.setAttribute("href", "na_style_" + styleNum + .css);
   document.head.appendChild(styleNum);
}

J'ai reçu quelques erreurs mais le problème est que c'est écrit dans une forme que je ne comprends pas vraiment. Par exemple:

"Traceback (dernier appel le plus récent): Fichier "nt-test-3ed2ebdf.py", ligne 14, dans assert (link.get_attribute ('id') == 'fancySheet'), 'L'attribut id doit être défini sur "fancySheet" . Réel: "'+ str (link.get_attribute (' id ')) +'" ' AssertionError: l'attribut id doit être défini sur "fancySheet". Réel: "" "


1 commentaires

guillemets manqués autour de .css dans cette ligne styleNum.setAttribute ("href", "na_style_" + styleNum + .css);


3 Réponses :


1
votes

Dans la ligne styleNum.setAttribute ("href", "na_style_" + styleNum + .css); mettez .css entre guillemets, car il s'agit d'une chaîne et non d'un nom de la variable.

styleNum.setAttribute ("href", "na_style_" + styleNum + '.css');

window.addEventListener("load", setStyles);

function setStyles() {
   var styleNum = randInt(5);
   var styleEle = document.createElement("link");
   styleEle.setAttribute("rel", "stylesheet");
   styleEle.setAttribute("id", "fancySheet");
   styleEle.setAttribute("href", "na_style_" + styleNum + ".css");
   document.head.appendChild(styleNum);
}


0 commentaires

1
votes

Vous avez utilisé le même nom pour deux variables. Comme ils sont déclarés avec var , il ne lancera pas d'erreur. Le second écrasera le premier.

Changez simplement le nom de l'une des variables

Enveloppez également .css dans ""

window.addEventListener("load", setStyles);

function setStyles() {
   var styleNum = randInt(5);
   var styleElm = document.createElement("link");
   styleElm.setAttribute("rel", "stylesheet");
   styleElm.setAttribute("id", "fancySheet");
   styleElm.setAttribute("href", "na_style_" + styleNum + ".css");
   document.head.appendChild(styleElm);
}


1 commentaires

Veuillez arrêter de laisser des commentaires sur les votes négatifs. Ces commentaires ne sont que du bruit. Si la personne qui a voté contre avait voulu fournir une explication plus détaillée, elle l'aurait fait. Ils ont choisi de ne pas le faire, ce qui est tout à fait correct. Ils ne verront jamais vos commentaires.



0
votes

Le nombre généré aléatoirement est censé être stocké dans une variable séparément du nœud d'élément. Puisque vous utilisez styleNum comme nom des deux variables, d'abord un nombre aléatoire sera généré et stocké dans styleNum, puis le nouveau nœud d'élément sera créé et à droite le nombre généré aléatoirement, qui est maintenant perdu à jamais car les variables ne peuvent pas stocker deux valeurs différentes. Pour éviter cela et conserver le nombre aléatoire à utiliser plus tard dans la fonction, vous devez nommer le nœud d'élément en cours de création autrement que styleNum

Voici un exemple de code qui évite cela: p >

function setStyles() {
   var styleNum = randInt(5);
   var styleElementNode = document.createElement("link");
   styleElementNode.setAttribute("rel", "stylesheet");
   styleElementNode.setAttribute("id", "fancySheet");
   styleElementNode.setAttribute("href", "na_style_" + styleNum + ".css");
   document.head.appendChild(styleElementNode);
}

Notez également comment j'ai ajouté le "" autour de .css et changé styleNum en styleElementNode dans l'argument de la fonction sur la dernière ligne. En effet, la fonction est destinée à ajouter le nœud d'élément créé, et non le nombre généré aléatoirement, à l'en-tête du document.


0 commentaires