如何动态添加和删除多个类名的文本

How can I dynamically append and remove text for multiple class names?

本文关键字:文本 删除 何动态 动态 添加      更新时间:2023-09-26

我的页面中有很多元素。

        <input class="userInput" type="text" />
        <img src="myPic.png" class="userImage" id="userImage" />
        <input class="firstNameInput someOtherClass" type="text" />
        <input class="lastNameInput" type="text" />
        ...etc...

然而,我需要编写一个函数来动态更改类,使它们以"Red"结尾。例如"userInputRed"、"userImageRed"。然后用另一个函数将它们还原。

我可以很容易地选择它们。。。

$('.userInput','.userImage'....)

但我不知道如何在不为每个元素单独添加和删除类的情况下修改它们现有的类。

例如$('.userInput').removeClass('userInput').addClass('userInputRed')

有没有一种方法可以在不重复的情况下使用JQuery来做到这一点?

所以像这样的事情。。。

$('.userInput','.userImage'....).appendToClassName('red');
$('.userInputRed','.userImageRed'....).removeFromClassName('red');

您可以使用.userInput.red 在CSS中切换class.red并将其作为目标