Switch 语句和 jQuery hasClass 函数

Question

我正在尝试使用 switch 语句来检查当前页面是否具有特定的主体类。这就是我正在寻找的东西：

var bodyClass = $('body').hasClass('className')

 switch(bodyClass) {
    case 'homepage':
        // console.log("This is the homepage");
        break;
    case 'residential-page':
        // console.log("This is the residential page");
        break;
     default:
     // console.log("default code block ran");
 }

我确实理解 jQuery hasClass 函数返回 true 或 false，并且像 $('body').hasClass('someClassName') 一样使用，这将返回 true 或 false。另外，我的身体通常对给定页面有大约 7-10 个不同的类名。

Answer 1

我认为这不是交换机的用例，而是一组简单的分支

var body = $('body');

if(body.hasClass('abc')) {
}
else if(body.hasClass('def')) {
}
else {
  /* default case */
}

/* etc */

Answer 2

我同意另一个答案，即您更适合在此处使用 if, else if 语句，但另一种选择是将类从 body 标记中剥离并根据您的字符串检查它们：

var bodyClasses = ($('body').attr('class') || '').split(' ');

for (var i = 0, len = bodyClasses.length; i < len; i++) {
 switch(bodyClasses[i]) {
    case 'homepage':
        // console.log("This is the homepage");
        break;
    case 'residential-page':
        // console.log("This is the residential page");
        break;
     default:
     // console.log("default code block ran");
 }
}

Answer 3

我知道这是一个旧线程，但它可能对其他人有帮助。

如果您能够确保按特定顺序声明元素的类，则可以确保您要检查的类位于列表中的第一个/最后一个，并使用与此类似的内容：

var bodyClass = $('body').attr('class');
var firstClass = bodyClass.slice(0, bodyClass.indexOf(' '));

switch(firstClass) {
    case 'homepage':
        // Some code here
        break;
    case 'residential-page':
        // Other code here
        break;
    default:
        // More code here
}

Answer 4

这个问题已经问了很长时间了。我将在这里添加我的答案，因为它可能对其他人有帮助。

switch (true) {
    case $('body').hasClass('homepage'):
        // console.log("This is the homepage");
        break;
    case $('body').hasClass('residential-page'):
        // console.log("This is the residential page");
        break;
    default:
    // console.log("default code block ran");
}