Question

仍在尝试找出惯用的jQuery - 这里有一些用于在div类上设置变量的jQuery - 有一种jQuery方式可以更紧凑地执行此操作，因为有问题的div可能有多个类。 ..

var currentType = 'component';
// text_component, image_component, tagged_component
if ($(my_div).hasClass('.text_component'))   { currentType = 'text_component' };
if ($(my_div).hasClass('.image_component'))  { currentType = 'image_component' };
if ($(my_div).hasClass('.tagged_component')) { currentType = 'tagged_component' };  

var dialog_box = $('div[id^='+currentType+'_dialog]');

Answer 1

currentType = $(my_div).attr("class");

这将分配class属性中的任何内容，从而也处理多个类

如果以后你想要进行单独检查，你可以将这些类拆分成一个单独的类值数组......就像这样：

var classes = currentType.split(' '); //return an array of separate class values

Answer 2

如果我告诉你，我建议你使用由John Resig（jquery的创建者）编写的metadata plugin，你可以在任何div元素上设置任何数据供以后使用。而且你不需要从css类中获取参数。您可以随时读取该数据。

示例标记:(来自插件页面）

<div class="someclass {some: 'data'} anotherclass">...</div>

然后在javascript中：

var data = $('div.someclass').metadata();
if ( data.some == 'data' ) alert('It Worked!');

希望它有所帮助，思南。

Answer 3

使用hasClass进行测试时，请勿包含.（点）。

至于更简单的方法，你可以缩短它，但使用hasClass可能是最好的方法。

我假设这些类具有优先级（如果有多个类，那么if系列中的后者优先于其他类）？或者您想支持多个“组件”吗？

这是一个更有效的版本，可以更好地展示正在发生的事情：

var currentType, div = $(my_div);
// text_component, image_component, tagged_component
if (div.hasClass('tagged_component')) currentType = 'tagged_component';
else if (div.hasClass('image_component')) currentType = 'image_component';
else if (div.hasClass('text_component')) currentType = 'text_component';
else currentType = 'component';

var dialog_box = $('div[id^='+currentType+'_dialog]');

在jQuery中基于CSS类设置变量

3 个答案: