使用jQuery在页面中插入大量HTML和样式表 - 最佳实践？

Question

我制作了一个网站主题，并且我已经包含了一个贴在屏幕一侧并提供各种设置的栏。但是，它需要在页面内部进行相当多的标记，并且我的主题部分卖点是干净/最小的源代码！

所以我想通过使用一行JavaScript来包含我的栏。有没有办法使用jQuery插入HTML代码和样式表？这也违背了最佳做法，我可能会因为这样做而受到惩罚（谷歌）吗？

编辑：我编辑了这个问题，以明确我不要求jQuery样式表切换器（谢谢）。

Answer 1

机器人不执行javascript。机器人看不到javascript生成的任何内容。

因此，如果您要使用JS生成菜单，那将会发生。

并回答“是否有办法使用jQuery插入HTML代码和样式表？”是的。

只需使用例如普通的.append（）。对于样式表$（'head'）。append（）和另一个你把它放在你喜欢的地方，也许是$（'body'）。append（）？

Answer 2

我不确定是不是这种情况不再如此，但如果我没记错，搜索引擎机器人不会运行javascript，但这可能已经改变了。

性能方面，使用$（）包装一大串html比创建基本元素，插入子元素然后继续插入子元素等更好看的标记更好。

对于最佳实践，除非您使用某种模板文件用于HTML，否则插入一大块HTML的方法通常不易维护。如果它只是JS文件中的一个大字符串，则在编辑器中没有任何语法突出显示和正确的HTML行为。因此，如果性能不是问题（例如，如果它不是那么多HTML而且只插入一次），那么为了可维护性，我会采用更结构化的方法。

Answer 3

1. 这可能是开始使用LESS的合适时间：LESS使用动态行为（如变量，mixins，操作和函数）扩展CSS。 （使用它可以避免制作大量样式表）

2. 此外，您还可以了解jQuery UI团队如何使用@import语句轻松轻松地创建theme roller。

3. jQuery style switcher也是一个非常小的插件，我喜欢它的实现。

Answer 4

如果我理解正确，你可以做类似这样的事情：

http://jsfiddle.net/ajthomascouk/DbRwn/

在此示例中，它只是更改文本颜色。但是，您可以使用此方法更改样式表的src（请参阅更新）。

<强>更新 像这样 - http://jsfiddle.net/ajthomascouk/DbRwn/2/

希望这有帮助。