Question

使用jquery和加载了hquery的超级简单的html页面，我想让背景变为绿色。

没有加载css，只是加载了基本的html页面和jquery脚本。

如何让背景变绿？

Answer 1

实现这一目标的最简单方法是使用CSS，使用以下声明链接样式表：

html, body {
    background-color: #0f0;
}

如果您不想链接到样式表，请使用：

<body style="background-color: #0f0;">

或者使用JavaScript：

document.getElementsByTagName('body')[0].style.backgroundColor = '#0f0';

或jQuery，如果你必须：

$('body').css('background-color','#0f0');

值得建议的是，如果您愿意包含jQuery库¹，您可能需要重新考虑不要包含适当的样式表，以实现真正的内容分离和设计。即使你只在文档的head中包含CSS，它也比后面的开发人员更容易使用，而不是使用jQuery或style属性来为元素分配样式。

<小时/> 1 不是特别重包含（特别是如果它已经被缓存），大小相当于小型图像文件的大小，但在放置页面时仍需要考虑重量在一起。

Answer 2

由于我遇到过像你这样的场景很多次，根据我的经验，有时HTML中的快速修复（例如内联样式）可能会导致问题，有时更改CSS文件或添加新文件会导致问题（是的我说过！有时听起来并不那么容易！），所以我的解决方案是：

如果只有一个HTML页面并且您需要永久修复，那么最好的办法是：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document Title</title>
    ...
    <style type="text/css">
        body {
            background-color: #00FF00;
        }
    </style>
</head>
<body>
...
</body>
</html>

那么为什么要将风格融入脑袋？为什么没有内联样式？为什么没有单独的css文件，答案很简单！

这是让您的身体拥有即时风格并使您的模板可扩展的最简单方法。总是在我编写代码时，我记得以后这将会改变。也许我会改变主意而不是绿色，我会变蓝。或者将来我想复制相同的模板并拥有另一个快速模板。特别是当您通过JavaScript更改CSS时，将来可能会导致巨大的问题。我确实花了很多开发时间来意识到CSS是通过JavaScript改变的。这是不容易追踪的东西。所以请记住这些规则：

CSS处于单独的文件 [GOOD] （可扩展，您可以缓存文件，并且可以使用firebug轻松跟踪）
CSS作为HTML头部的样式 [NOT BAD] （您可以轻松更改它，并且可以使用firebug检测它。这也是确保CSS将会发生的最好方法立即加载）
内联CSS [BAD] （可以轻松检测到，但根据我的经验，它只是一个临时修复，可能导致可扩展性问题）
带有JavaScript的内联CSS [EVIL] （使用您的firebug无法检测到它。它无法轻易更改，也没有理由这样做！）

Answer 3

这应该这样做：

jQuery('body').css('background-color','green');

Answer 4

加载文档后，这会将背景颜色更改为绿色：

<script type="text/javascript">   
$(function() {
   $('body').css('background-color','#0F0');
});
</script>

Answer 5

内联风格......

<body style="background-color: #0f0;">

你也可以这样做：

<body style="background-color: green;">

尽可能使背景绿色变得容易

5 个答案: