jQuery实现样式设置、添加、删除和切换方法。
本文演示了jQuery如何实现样式设置、添加、删除和切换:使用jQuery,元素的样式操作可以非常简单,让我们看看如何使用jQuery来实现元素样式的获取、设置、添加、删除和其他操作。
获取并设置样式
让课堂和建立类可以使用attr()方法。例如,attr()方法得到的P元素的类,和jQuery代码如下:
无功p_class = $(p)。Attr(类);
获取p元素
attr()方法用于设置P元素的类,和jQuery代码如下:
$(p)Attr('。
设置p元素是类高
在大多数情况下,它将原来的类替换为一个新类,而不是在原来的基础上添加一个新类。
添加样式
什么是加法课如果P元素的原始类MyClass,然后添加一个类称为高,和阶级属性成为MyClass高,即两个款式的MyClass和high.jquery叠加提供了一个特殊的addClass()来添加样式的方法。为了使例子更容易理解,在风格标签添加另一套款式:
高{色:红;}
另一种{字体样式:斜体;颜色:蓝色;}
然后向Web页面中的类类添加一个按钮,按钮的事件代码如下所示:
$(# btn_3)。Click(function(){)
$(# nm_p)。AddClass(另一个);
添加样式
});
最后,当单击类类按钮时,p元素样式变为斜体,而以前的红色字体变为蓝色。此时,p元素同时具有两个类值,即高和另一个。
1。如果将多个类值添加到元素中,则等效于它们的样式的组合。
2。如果不同的类设置相同的样式属性,则后者覆盖前者。
在这种情况下,等于p元素添加以下样式:
颜色:红色;红色/红色字体颜色设置
字体样式:斜体;
颜色:蓝色;
在上面的样式中,有两个颜色属性,后一个颜色属性将覆盖前面的颜色属性。所以最后的颜色属性是蓝色而不是红色。
拆卸式
如果用户想删除值类的点击一个按钮时,它可以使用removeClass()的方法()方法,请对其功能是删除所有或指定的类从匹配的元素。例如,你可以使用以下的jQuery代码来删除一个类:在P元和价值高
$(p)。RemoveClass();
删除类的p元素值
如果你想删除两类P元素,使用两removeClass()方法和代码如下:
复制代码代码如下:$(p)。RemoveClass(高),RemoveClass(另一个);
jQuery提供了一种更简单的方法,可以在空白空间中删除多个类名。代码如下:
复制代码代码如下:$(p)。RemoveClass(高个);
此外,您还可以使用removeClass()的特征来做同样的效果的方法。当它没有参数,类的所有的值都删除,和jQuery代码如下:
$(p)。RemoveClass();
要删除p的所有类元素
开关式
jQuery()中有一个方法,jQuery代码如下所示:
ToggleBtn.toggle(function(){()
代码显示元素
}函数(){()
隐藏的代码元素
})
切换()方法在这里的作用是交替执行两个函数,代码3和代码4。如果元素最初显示,隐藏元素:如果元素最初隐藏,然后显示它们。
此外,jQuery提供了一个重复的开关在toggleclass()方法的控制方式。如果存在类的名称,它被删除,如果类的名称不存在,它补充说。例如,P元素的toggleclass操作()方法。
$(p)。ToggleClass(另一个);
重复开关另一个类名
当开关式按钮被点击的P元素的类的值将被复制在MyClass和MyClass的另一。
确定是否有风格
HasClass()可以用来确定一个类中没有包含的元素,如果是这样,则返回TRUE,否则返回false。例如,你可以使用下面的代码来确定是否一个P元素包含另一个类中的:
复制代码代码如下:$(p)。HasClass(另一个);
这个方法是为了提高代码可读性而设计的。该方法相当于下面的代码:
复制代码代码如下:$(p);
希望本文能对大家的jQuery程序设计有所帮助。