使用jQuery子元素过滤选择器选择元素_jsp子元素过滤选择器。子元素过滤选择器如何选择指定的元素并进行有关的操作

作者：Monodyee | 2024-05-15 17:19:09

踩

jsp子元素过滤选择器。子元素过滤选择器如何选择指定的元素并进行有关的操作

<!--

子元素过滤选择器：在页面开发过程中，常常遇到突出指定某行的需求。虽然使用基本过滤选择器：eq(index)可实现单个表格的显示，但不能满足大量数据和多个表格的选择需求。为了实现这样的功能，jQuery中可以通过子元素过滤选择器轻松获取所有父元素中指定的某个元素。

jQuery选择器详解

根据所获取页面中元素的不同，可以将jQuery选择器分为：基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中，在过滤选择器中有可以分为：简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器6种
-->
<title></title>

<script src="jquery-1.9.1.js" type="text/javascript"></script>
<style type="text/css">
body
{
font-size: 12px;
text-align: center;
}
ul
{
width: 241px;
list-style-type: none;
padding: 0px;
}
ul li
{
height: 23px;
width: 60px;
line-height: 23px;
float: left;
border-top: solid 1px #eee;
border-bottom: solid 1px #eee;
margin-bottom: 5px;
}
.GetFocus
{
width: 58px;
border: solid 1px #666;
background-color: #eee;
}
</style>
<script type="text/javascript">
// $(function () {//增加每个父元素下的第二个子元素类别
// $('li:nth-child(2)').addClass('GetFocus');
// })
// $(function () {//增加每个父元素下的第一个子元素类别
// $('li:first-child').addClass('GetFocus');
// })
// $(function () {//增加每个父元素下的最后一个子元素类别
// $('li:last-child').addClass('GetFocus');
// })
// $(function () {//增加每个父元素下只有一个子元素类别
// $('li:only-child').addClass('GetFocus');
// })
</script>
</head>
<body>
<ul>
<li>Item 1-0</li>
<li>Item 1-1</li>
<li>Item 1-2</li>
<li>Item 1-3</li>
</ul>
<ul>
<li>Item 2-0</li>
<li>Item 2-1</li>
<li>Item 2-2</li>
<li>Item 2-3</li>
</ul>
<ul>
<li>Item 3-0</li>
</ul>
</body>
</html>

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Monodyee/article/detail/574091