jquery如何获取页面使用指定样式的个数

思路：在页面设计时就将指定的样式设置为一个class，然后应用到需要的元素上。那么此时可以通过类选择器来获取使用指定样式的个数

$("some_class")length;  // 获取应用了some_class的元素的个数

实例演示：本例将红色设置为一个类 red，并应用到不同的元素中去，然后可以通过上述方法获取应用的个数

创建Html元素

<div class="box">

<span class="red">点击按钮获取应用了红色样式的元素的个数：</span><br>

<div class="content">

    <table>

        <tr><td>1</td><td>2</td><td>3</td></tr>

        <tr><td>4</td><td class="red">5</td><td>6</td></tr>

        <tr><td>7</td><td>8</td><td>9</td></tr>

    </table>

    <ul>

  <li>Glen</li>

  <li class="red">Tane</li>

  <li>John</li>

  <li class="red">Ralph</li>

</ul>

</div>

<input type="button" value="获取应用了红色样式的元素的个数">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox>span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

table{border-collapse:collapse;}

td{width:30px;height:30px;line-height:30px;text-align:center;border:1px solid green;}

li{margin:5px;list-style: none;}

red{color:red !important;}

编写jquery代码

$(function(){ 

$("input:button")click(function() {

alert($("red")length);

});

});

观察效果

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：indexhtml，并引入jquery。

2、在indexhtml中的<script>标签，输入jquery代码：$('body')append($('a')length);。

3、浏览器运行indexhtml页面，此时用jquery获取了class是a的个数并打印。

$("div")each(function () {

    var $div = $(this);

    var $img = $divfind("img");

    if ($imglength == 3) {

        $imgcss({ "margin": "15px" });

    } else if ($imglength == 2) {

        $imgcss({ "margin": "20px" });

    }

});

1、比如我们要得到或者获取到这个div元素。

2、我们就可以这样做，使用$("div")，这就是直接通过元素名来获取，注意要加引号哦。

3、或者你可以给元素添加类，如图，我就加了一个bd类。

4、然后我们这样$("bd")也是可以得到div元素的哦，注意类名是需要一个点的哦。

5、此外，id也是一个不错的方法，不过id只能有一个，不能重名哦。

6、jQuery中id要加#号才会有效哦。

7、最后我就整理好jQuery一些比较常用的获取元素的方法。

<table>

<TR>

<TD><DIV>编号：</DIV></TD>

<TD >1234</TD>

</TR>

<TR>

<TD><DIV>商品：</DIV></TD>

<TD >测试</TD>

</TR>

<TR>

<TD><DIV>数量：</DIV></TD>

<TD >1</TD>

</TR>

</table>

<script language="javascript">

var temp = $('div:contains(编号)')parent()next('td')text();

alert(temp); // 1234

</script>

以上就是关于jquery如何获取页面使用指定样式的个数全部的内容，包括:jquery如何获取页面使用指定样式的个数、jquery 怎么获取相同class的个数、Jquery判断div里的length个数来控制不同的css等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！