javascript - 类名作为带有附加代码的函数中的变量

Question

我想设置一个更长的类名作为变量，以便只使用一次而不是每次都使用它。我可以单独使用或获取其他代码，例如“:last”。

我有以下代码:

HTML:

<section class="start">
 <div class="hello container">
  <div class="someclass"></div>
  <div class="someclass"></div>
  <div class="someclass"></div>
 </div>
</section>

JS

var fullClassName = section.start .hello.container .someclass;
$("+fullClassName+").addClass("hello");
$("+fullClassName+:last").addClass("last");

不幸的是，我的代码想法不起作用......

Answer 1

如果我正确理解你的问题，听起来这可能是使用 ES2015 template strings 的好机会。

这实际上允许您将 JavaScript 表达式嵌入到字符串中。因此，如果您有一个包含您希望选择的类的变量，并且 jQuery 选择器的其余部分是其他字符串(例如 :last、[data-target="foo"] 等)，您可以将变量嵌入到字符串中。

例如:

const classesToSelect = ".some .element .with .lots .of .classes";

// Append the :last selector usin template string
$(`${classesToSelect}:last`)

当然，您不必为此使用模板字符串。您可以简单地使用 + 运算符:

// Using string concatenation
$(classesToSelect + ":last")

综上所述，您可能想温习一下 JavaScript strings一般来说。这可能会让您更好地了解问题的解决方案。