Comment passer de l'objet en tant que paramètre dans le Javascript?

J'ai trouvé quelques questions ici concernant ma question, mais n'a pas exactement obtenir la réponse que je cherchais. Je suis désireux de faire quelque chose comme cela, semblable à ce que jQuery n'est souvent:

createCSS("mystyle.css", {
    media: "screen",
    type: "text/css"
});

J'ai essayé d'accomplir ce que je veux, mais ça ne fonctionne pas:

var prop = {
    media: '',
    type: ''
};

function createCSS(href, prop) {
    var anchor = document.createElement("link");
    anchor.setAttribute("href", href);
    anchor.setAttribute("media", prop.media);
    anchor.setAttribute("type", prop.type);

    if(typeof anchor != "undefined") {
        document.getElementsByTagName("head")[0].appendChild( anchor );
    }
}

Maintenant, je sais que je pourrais juste créer unique de plusieurs paramètres comme la createCSS("mystyle.css", "screen", "text/css"); mais je n'aime pas que l'autre semble plus frais.

Plein de nouveaux javascript sorte que toute aide serait grandement appréciée!

Avez-vous essayé de simplement éliminer le var prop = { ... } déclaration? Et de tester si tout le reste fonctionne...

OriginalL'auteur ModernDesigner | 2013-02-01

  1. 10

    Vous n'avez pas à déclarer/initialiser var prop. Votre fonction a l'air bien, il vous suffit d'appeler passage d'un objet comme prop, comme dans votre exemple:

    createCSS("mystyle.css", {
    media: "screen",
    type: "text/css"
});

    Si l'intention avec la var prop partie était d'éviter d'attribuer des undefined pour les attributs, vous avez besoin d'un peu de tweak l'intérieur de la fonction:

    function createCSS(href, prop) {
    prop = (typeof prop !== "object") ? {} : prop;
    prop.media = prop.media || 'screen';  //default media will be screen
    prop.href = prop.href || 'text/css';  //default type will be text/css
    //rest of code
}

    Quelques améliorations mineures que je vous suggère:

    • Votre variable anchor ne contient pas un point d'ancrage (<a>) de l'élément. Pourquoi ne pas l'appeler link?
    • Vous ne semblez pas besoin de la if(typeof anchor != "undefined") conditionnelle. puisque vous êtes en train de créer l'élément quelques lignes ci-dessus, cette variable ne sera jamais défini. Vous pouvez ignorer les if et appendChild directement.
    Oh, wow. Ok. Je pense que prop.media et prop.type rendrait pas défini. Merci!
    vous pouvez prédéfinir prop, mais dans ce cas, n'oubliez pas de l'inclure dans l'appel: createCSS("mystyle.css", prop)
    Vous avez déjà eu et ne le savais pas :). Aussi: j'ai juste ajouté un couple de suggestions qui peuvent vous aider à améliorer votre code.
    wow! Merci. Je l'aime. Et merci de me laisser savoir à propos de l'inutile instruction conditionnelle. Je l'ai trouvé par renifler en ligne et n'ai pas vraiment aimé les regards de toute façon. De bonnes suggestions, trop.

    OriginalL'auteur bfavaretto

  2. 4

    "J'ai essayé d'accomplir ce que je veux, mais cela ne fonctionne pas"

    La façon dont vous passez votre objet est bien. Bien qu'il existe des choix intéressants dans la fonction, il fait ce que vous demandez. Cependant, avez-vous inspecté le lien que vous créez? Il manque de la rel directive, qui est une exigence.

    Vous souhaitez modifier votre fonction:

    function createCSS(href, prop) {
 var anchor = document.createElement("link");
 anchor.setAttribute("href", href);
 anchor.setAttribute("media", prop.media);
 anchor.setAttribute("type", prop.type);
 anchor.setAttribute("rel", prop.rel);
 document.getElementsByTagName("head")[0].appendChild( anchor );
}

var prop = { 
 media: "screen",
 type: "text/css",
 rel: "stylesheet"
}

createCSS( "mystyle.css", prop );
    Belle prise sur rel
    Merci! Il m'a fallu 10 minutes pour comprendre pourquoi test.css ne fonctionnait pas, et c'était à cause de la rel. +1

    OriginalL'auteur Travis J