代码之家 › 专栏 › 技术社区 › peirix

使用jQuery在两个元素之间切换类

jquery

peirix · 技术社区 · 15 年前

我有两个元素,每个元素都有一个类名。我想让他们换个班。
所以基本上我想这样做:

$("#div1").switchClassWith("#div2");

<div id="div1" class="someStylingClass">...content...</div>
<div id="div2" class="someOtherClass">...content...</div>

这会导致 #div1 someOtherClass #div2 有 someStylingClass ... 有什么建议吗?

4 回复 | 直到 15 年前

user229044 15 年前

你可以用 toggleClass() :

 $('#div1,#div2').toggleClass('someStylingClass someOtherClass');

假设您从发布的示例开始,其中每个元素都有一个类或另一个类(但不是两个),那么这将按预期工作。

如果需要在不知道要交换哪些类的情况下交换类,可以执行以下操作:

var $div1 = $('#div1'), $div2 = $('#div2'), tmpClass = $div1.attr('class');
$div1.attr('class', $div2.attr('class'));
$div2.attr('class', tmpClass);

IgalSt 15 年前

function SwitchClass(a,b){
  var aClass = a.attr('class');
  var bClass = b.attr('class');
  a.removeClass(aClass).addClass(bClass);
  b.removeClass(bClass).addClass(aClass);
}


SwitchClass($('div1'),$('div2'));

Rahul 15 年前



function swapClasses(element1, element2)
{
   class1List1 = getClassList(element1)
   classList2 = getClassList(element2)

   for class in classList1
   {
       element2.addClass(class)
   }

   //similarly for element1
}

function getClassList(element)
{
   //refer to http://stackoverflow.com/questions/1227286/get-class-list-for-element-with-jquery
}