我正在编写一个
JQuery组件插件,需要一些最小的默认css. (组件的功能布局需要css – 而不仅仅是样式修饰)我应该:
>写一个单独的.css文件并在我的插件代码中动态加载它(我该怎么做?)
>使用JQuery的.css(…)直接在我的插件代码中应用css属性
似乎第二种选择是确保我的组件获得所需的css的更安全的方式.思考?
解决方法
我喜欢将CSS保存在单独的文件中,然后使用插件导入它.
加班,这使得它更容易维护,它使用户或未来的开发人员更容易使用您的插件,而不是挖掘JavaScript源(可能会超时).
要使用jQuery应用样式表,您可以这样做:
$(function() { $('head').append('<link rel="stylesheet" href="plugin-styles.css" type="text/css" />'); });
显然,您需要知道CSS文件的路径,但如果您使用插件发布css目录,这应该不是问题.
就“确保[你的]组件获得所需的css”而言,只要确保你的元素具有JavaScript源可以访问的唯一标识符(类名或ID),第一个选项就会起作用.
如果你想确保你没有多次加载样式表,你可以这样做:
$(function() { var bStylesheetExists = false; $('link').each(function() { if($(this).attr('href') === 'plugin-style.css')) { bStylesheetExists = true; } }); if(bStylesheetExists === false) { $('head').append('<link rel="stylesheet" href="plugin-styles.css" type="text/css" />'); } });