Question

我在这里发现了一些与我的问题有关的问题，但没有得到我正在寻找的答案。我想做这样的事情，类似于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，所以任何帮助将非常感谢！

Answer 1

您不必声明/初始化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")条件。因为你正在创建上面几行的元素，所以该变量永远不会被定义。您可以直接跳过if和appendChild。

Answer 2

“我试过这个来完成我想要的但是它不起作用”

传递对象的方式很好。虽然函数中有一些有趣的选择，但它可以满足您的要求。但是，您是否检查过您创建的链接？它缺少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 );

如何在Javascript中传递对象作为参数？

2 个答案: