0

所以我有一个看起来像这样的css文件：

.textbox{
 position: fixed;
 width: 225px;
 }

然后我有一个看起来像这样的 JQuery 方法：

function textbox(name) {
...
$(".textbox_" + name).text();
...
$(".textbox-" + name).text();
    }

我不知道下划线和连字符的作用，因为 css 文件中没有下划线或连字符的内容。我真的不明白如何在 css 中传递变量。

4

2 回答 2

1

让我们假设 name == foo。如果我理解正确，您正在比较您的 CSS 和 JavaScript 代码并注意到这些标识符之间的相似性：

  • .textbox
  • .textbox-foo
  • .textbox_foo

所以你想知道：是foo某种参数或伪类.textbox与你的 CSS 中的类相结合吗？这里有什么关系？

答：没有。 textbox, textbox-foo, 和textbox_foo都是完全不同的 HTML/CSS 类名。连字符和下划线在 CSS 中作为标识符的一部分是完全有效的，所以这三个类就像它们被命名为abc、def和一样不同ghi。

所以没有变量被传递给你的 CSS。你是对的，CSS 没有变量。您所看到的只是名称相似的不同类，但就浏览器而言是不相关的。

不过， jQuery 调用$(".textbox_" + name)是 JavaScript，您可以在 JavaScript 中传递变量。使用 jQuery，此代码查找具有类 name 的 HTML 元素序列textbox_foo，其中foo是您传递给textbox函数的任何名称。它不会触及 classtextbox或的元素textbox-foo，除非它们也有textbox_foo该类。

jsFiddle 演示

至于 JavaScripttextbox函数，如果不看它的其余部分，就无法知道它做了什么。我的猜测是，基于我见过的其他 jQuery 插件，它会根据name您提供的参数来操作页面中新的或现有的文本框。它可能会向它们添加样式和行为，并在此过程中动态添加带有类textbox-foo和/或textbox_foo. 相似的名称可能是为了帮助您理解生成的 HTML 源代码。

于 2013-06-11T21:11:25.293 回答
0

该函数从文本框中动态获取文本。因此，如果您将字符串参数传递"blah"给该函数：

textbox("blah");

然后jQuery 正在获取具有类或的元素内部的文本。textbox_blahtextbox-blah

如果这些元素确实存在，您可以在类名上使用 CSS 来设置它们的样式。

于 2013-06-11T20:42:33.610 回答