Question

我有弹出窗口，我可以按属性更改图标：

$(this).attr('class', popup.find('i').attr('icon-class'));

和这个元素的HTML：

<i class="small icon-adjustments"></i>

但是您可以看到我有两个类 small和icon-adjustments更改。

问题是当我更改类时，我的脚本也会删除small类。我怎么才能改变课堂的第二部分呢？

Answer 1

更改className属性的一部分的最简单方法可能是使用jQuery：

$(this).removeClass('icon-adjustments').addClass('new-class-name')

但也有一些其他方法。

例如，您可以使用replace：

this.className.replace('icon-adjustments', 'new-class-name')

或按空格拆分className属性，然后替换第n个元素：

var names = this.className.split(' ')
names[1] = 'new-class-name'
this.className = names.join(' ')

如果您只想删除类名的一部分，只需传递一个空字符串。

抽象此代码的方法可能如下所示：

function replaceClass(element, oldClass, newClass) {
    var names = element.className.split(' ')
    var i, len;

    for (i = 0, len = names.length; i < len; i++) {
        if (names[i] === oldClass) {
            names[i] = newClass;
        }
    }

    element.className = names.join(' ')
}

http://jsfiddle.net/w3hL0h9d/

Answer 2

您可以使用jquery addclass代替attr

$(this).addClass(popup.find('i').attr('icon-class'));

Answer 3

在使用.removeClass()之前，您可以使用.addClass()。您可能需要在开头使用.hasClass()来检查某个类是否存在。

更改属性的一部分

3 个答案: