样式类选择器 (“.class”)
class selector
描述:选择所有带给定样式类的元素。
加入于: 1.0
jQuery( ".class" )class: 一个用来搜索的样式类。一个元素可能带有多个样式类;只要有其中一个样式类匹配。
对于选择器,jQuery使用JavaScript的原生getElementsByClassName()
函数,如果浏览器支持它的话。
示例
找到所有的带“myClass”样式类的元素。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>class demo</title> <style> div, span { width: 120px; height: 40px; float: left; padding: 10px; margin: 10px; background-color: #EEEEEE; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <div class="notMe">div class="notMe"</div> <div class="myClass">div class="myClass"</div> <span class="myClass">span class="myClass"</span> <script> $( ".myClass" ).css( "border", "3px solid red" ); </script> </body> </html>
演示结果
找到所有带“myclass”类以及“otherclass”类的元素。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>class demo</title> <style> div, span { width: 120px; height: 40px; float: left; padding: 10px; margin: 10px; background-color: #EEEEEE; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <div class="myclass">div class="notMe"</div> <div class="myclass otherclass">div class="myClass"</div> <span class="myclass otherclass">span class="myClass"</span> <script> $( ".myclass.otherclass" ).css( "border", "13px solid red" ); </script> </body> </html>
演示结果