Question

我需要从body标签获取类名，以“title-”开头，然后将该类后缀添加到具有类“title”的H1。如果没有前缀为“title-”的类，则H1应该具有“style-default”类。

“title-style1” - 这个body类改变它的后缀（style1），也放在数组中，所以计算顺序无济于事。

<body  class="first something title-style1 last">

    <h2 class="title"> John Doe</h2>
    <!-- need to get this:-->
    <h2 class="title style1"> John Doe</h2>
    <!-- but I'mg getting  this:-->
    <h2 class="title style1 style-default"> John Doe</h2>
    <!-- this is just some other title-->
    <h2 class="style2"> John Malkovich</h2>

</body>

我设法得到了想要的后缀，但是不能正确地设置“style-default”。可能是一些“如果有别的”错误。

$(document).ready(function(){
    var classes = $("body").attr('class').split(' ');
    for (var i = 0; i < classes.length; i++) {
    // finding classes starting with title-
    var $matches = /^title\-(.+)/.exec(classes[i]);
        if ($matches != null) {
        $sufix = $matches[1];
            $(".title").addClass($sufix);      
        }
        else {
              // this also add class to every match ?
          $('.title').addClass('style-default');
        }
    }
});

这是一个小提琴 http://jsfiddle.net/lima_fil/xz9bA/60/

由于

Answer 1

您正在为每个body标记类运行if-else语句。因此，除非<body>标记只有一个类，否则您总会找到一些不是title-*的类。

您应修改代码，以便仅在style-default循环后添加for类。像这样：

var found = false;
for (var i = 0; i < classes.length; i++) {
    // finding classes starting with title-
    var $matches = /^title\-(.+)/.exec(classes[i]);
    if ($matches != null) {
        $sufix = $matches[1];
        $(".title").addClass($sufix);

        found = true;
        break;
    }
}

if (!found) {
    $('.title').addClass('style-default');
}

另外，请记住，以$开头的变量通常表示jQuery对象。（也许你混淆了PHP和JS？）

Answer 2

只需使用css

即可获得相同的结果

<style>
body.style-style1 h1 {
    color: white;
}
body.style-style2 h1 {
    color: red;
}
</style>

Jquery如果有什么东西！= null，也要'else'为真

2 个答案: