-3

有谁知道如何将 CSS 类应用于 JavaScript 变量？

我有两个变量：

var usr = 'You: ' + userinput;
var rpl = 'Chatbot: ' + chatbot.transform(userinput);

usr 变量用于人工输入系统，而 rpl 变量触发来自数据库的响应。

我需要为每个变量应用不同的 CSS 类。

有人可以帮忙吗？

4

3 回答 3

1

您不能将 CSS 类分配给 javascript 变量。

如果您使用的是 HTML，那么您可以使用 javascript/jquery 将您的值插入到已经设置为类的 HTML 元素中，或者可以使用 javascript/jquery 更改元素的类。

正如其他人所说，我们需要知道您将变量输出到哪里。CSS 样式 HTML 页面（或其他页面，如 XML），它不能设置脚本语言的样式，这是没有意义的，因为 javascript（或任何其他脚本语言）没有“显示”。

为了扩展我的答案，请考虑您有以下页面：

<html>
    <body>
        <p class="one">
            I am the first paragraph's text.
        </p>
        <p class="two">
            I am the second paragraph's text.
        </p>
    </body>
</html>

现在你有以下 CSS：

p.one
{
    color: #f00;
}
p.two
{
    color: #000;
}

就目前而言，第一段将有红色文本，第二段将有黑色文本。但是，您可以使用javascript/jquery以多种方式更改它。一个例子如下：

document.getElementsByClassName("one").ClassName = "two";
document.getElementsByClassName("two").ClassName = "one";

使用上面的代码，现在段落的颜色将被切换（重要的是要注意，您不仅限于“=”运算符。如果使用“+=”，则可以添加而不删除类（即，一个元素将被赋予另一个类而不带走旧类）。要使用 javascript 删除一个类，只需使用类似的东西， document.getElementsByClassName("one").ClassName = "";

最后，另一种方法可能只是更改元素本身的样式，就像这样（另外，这里有一个您可能会使用的链接： http: //answers.oreilly.com/topic/1819-how-to-change -an-elements-css-properties-with-javascript/）：

document.getElementsByClassName("one").style.color = "#000";

这是我更喜欢这样做的方式，除了我个人可能会使用 jquery 方法：

$(".one").css("color", "#000");
于 2013-04-18T14:14:09.883 回答
0

CSS 用于样式标记元素（HTML 等）。您不能将 CSS 直接应用于 Javascript 变量。

但是，当您将变量内容转换为 HTML 时，您可以将数据包装在 HTML 标记中并对其应用 CSS 样式。

于 2013-04-18T14:14:43.493 回答
0

这取决于这些变量是如何注入到页面中的，但是您可能希望将它们包装在一个 span 标记中以查看最终结果。

var usr = "<span class='user-input'>You: " + userinput + "</span>";
var rpl = "<span class='chatbot'>Chatbot: " + chatbot.transform(userinput) + "</span>";

在你的 CSS 中使用 .user-input 和 .chatbot。

您可以做的另一件事是尝试查找通过源代码将数据注入页面的 html 标记。可以通过 javascript (jquery) 将类添加到目标 html 标记。

于 2013-04-18T14:23:31.803 回答