3

ここで私の質問に関連するいくつかの質問を見つけましたが、探していた答えが正確には得られませんでした。jQueryがよく行うことと同様に、次のようなことをしたいと思っています。

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

やりたいことを達成するためにこれを試しましたが、うまくいきません：

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 );
    }
}

今、私は単一の複数のパラメーターを作成できることを知っていますcreateCSS("mystyle.css", "screen", "text/css");が、それは好きではありません.他の方法はよりクールに見えます.

JavaScript は初めてなので、どんな助けでも大歓迎です!

4

2 に答える 2

10

宣言/初期化する必要はありませんvar prop。propあなたの関数はうまく見えます.あなた自身の例のように、オブジェクトを渡して呼び出すだけです:

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

パーツの意図が属性へのvar prop割り当てを避けることであった場合は、関数内undefinedで少し調整する必要があります。

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
}

私が提案するいくつかのマイナーな改善：

  • 変数にアンカー ( ) 要素anchorが含まれていません。<a>なぜそれを呼ばないのlinkですか？
  • 条件は必要ないようですif(typeof anchor != "undefined")。数行上で要素を作成しているため、その変数が未定義になることはありません。ifand をappendChild直接スキップできます。
于 2013-02-01T18:12:16.790 に答える
4

「私は私が望むことを達成するためにこれを試みましたが、それは機能していません」

オブジェクトを渡す方法は問題ありません。関数にはいくつかの興味深い選択肢がありますが、それはあなたが求めていることを実行します。ただし、作成したリンクを調べましたか？要件であるrelディレクティブがありません。

関数を次のように変更することをお勧めします。

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 );
于 2013-02-01T18:23:02.123 に答える