类选择器想必很多喜欢jquery的朋友早早就涉及到了吧，它们的使用也应该了如指掌了吧，接下来帮大家温习下几个简单类选择器的使用方法，感兴趣的你可以参考下哈，希望对你有所帮助
复制代码 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestClassSelector.aspx.cs" Inherits="WebApplication1.TestClassSelector" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="https://www.jb51.net/Scripts/jquery-1.9.0.min.js"></script>
<style type="text/css">
.first_div {
background-color:red;
}
.second_div {
background-color:green;
}
.first_span {
width:500px;
height:100px;
}
.eric_sun_class {
font-family:Arial;
font-size:18px;
}
</style>
</head>
<body>
<form runat="server">
<div>
<div>
This is the first div
</div>
<div>
This is the second div
</div>
<div>
<span>
This is the first span
</span>
</div>
<span>
This is the first span + eric sun class.
</span>
<br />
<span>
This is the eric sun class.
</span>
<br />
<input type="button" value="Test" />
</div>
</form>
</body>
</html>
<script type="text/javascript">
function btn_Click() {
alert($(".first_div").text());
alert($(".first_div.first_span").text());
}
</script>
复制代码 代码如下:
$(".first_div, .first_span")
将包含有.first_div 或者 .first_span" 的对象都取到。 这里取到 4 个 对象。
此处的Html对应
复制代码 代码如下:
<div>
This is the first div
</div>
<div>
<span>
This is the first span
</span>
</div>
<span>
This is the first span + eric sun class.
</span>
复制代码 代码如下:
$(".first_div .first_span")
将以 .first_div 为类的控件 下的 以 .first_span 为类 的对象取到（类与类之间带有空格 逐层取）。 这里只取到 1 个。
对应的 className="first_span" 此处的Html对应
复制代码 代码如下:
<div>
<span>
This is the first span
</span>
</div>
复制代码 代码如下:
$(".first_span.eric_sun_class")
将包含有.first_span 并且同时包含有 .eric_sun_class 类的 对象取到（类与类之间没有空格 类似于 ‘与' 操作）。 这里只取到1个。
对应的 className="first_span eric_sun_class" 此处的Html 对应
复制代码 代码如下:
<span>
This is the first span + eric sun class.
</span>
您可能感兴趣的文章: