jquery如何判断某元素是否具备指定的样式

分为以下2种情况： 1.如果css写成行内样式，可以通过获取style属性的值来判断，示例如下： 判断id为divid的div元素是否有font-size样式： 代码如下: <div id=”divid” xss=removed></div> jquery代码如下： jQuery(“#divid”).each(function(){ var fontSize = $(this).attr(“style”).indexOf(“font-size”); if(fontSize != (-1)){alert&#40;“已定义”&#41;;} else{$(this) 在JavaScript的世界里，jQuery是一个非常流行的库，它简化了DOM操作、事件处理和Ajax交互等任务。本篇文章将深入探讨如何使用jQuery来判断一个元素是否具有特定的样式，包括行内样式和类样式。 我们要理解样式在HTML中的两种常见形式：行内样式和类样式。行内样式是直接在HTML元素的`style`属性中定义的，而类样式则是通过CSS类来应用的，这些类通常存储在外部CSS文件中或在HTML文档的`<style>`标签内定义。 1. **判断行内样式** 当样式以行内样式存在时，我们可以利用jQuery的`.attr()`方法来获取元素的`style`属性，并通过字符串操作来检查指定样式是否存在。例如，要判断ID为`divid`的`div`元素是否设置了`font-size`，可以这样做： ```javascript jQuery("#divid").each(function() { var fontSize = $(this).attr("style").indexOf("font-size"); if (fontSize != (-1)) { alert("已定义"); } else { $(this).css({"float": "left", "font-size": "12px"}); } }); ``` 这段代码首先遍历所有ID为`divid`的元素，然后检查其`style`属性中是否包含`font-size`。如果有，`indexOf`函数将返回非负值，表明样式存在；反之，`font-size`样式未定义，代码会添加一个新的样式。 2. **判断类样式** 对于类样式，我们需要检查元素的`class`属性。这同样可以通过`.attr()`方法完成，但这次我们查找的是`class`属性。如果元素具有某个类样式，我们可以在`class`属性的值中找到该类名。例如，要判断ID为`divid`的`div`元素是否包含类样式`divclass`： ```javascript jQuery("#divid").click(function() { if (jQuery(this).attr("class").indexOf("divclass") > 0) { jQuery(this).removeClass("divclass"); } else { jQuery(this).addClass("divclass"); } }); ``` 这段代码会在用户点击元素时检查`class`属性，如果找到`divclass`，就移除该类；如果找不到，就添加这个类。这实现了点击元素时切换背景颜色的效果，因为`divclass`可能定义了一个如`background-color: #F33;`的样式。 jQuery提供了一种方便的方式来检查和操作元素的样式。对于行内样式，我们使用`.attr("style")`并搜索目标样式名称；而对于类样式，我们通过`.attr("class")`并用`indexOf`检测类名。这些技巧在动态修改页面样式或者响应用户交互时非常有用。记得在实际应用中，根据需要适当地调整和优化代码，确保性能和可维护性。