<!doctype html>
<head>
<meta charset="UTF-8">
<title>得到li的数量</title>
<script type="text/javascript" src=">$("a b li")length; // a类后代b类中包含的li元素的数量
综合示例如下：
创建Html元素
<div class="box"><span>点击按钮获取li数量：</span><br>
<div class="content">
<div class="test">
<ul>
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
</div>
<div class="test">
<ul>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
<li>Ralph</li>
</ul>
</div>
<div class="test">
<ul>
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
</div>
</div>
<input type="button" value="获取li的数量">
</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;}
input[type='button']{height:30px;margin:10px;padding:5px 10px;}
ul{padding:5px 25px;border:2px dashed #cc6699;}
编写jquery代码
$(function(){$(":button")click(function() {
tol = $("content test li")length;
num = $("content test ul")map(function() {
return $(this)find("li")length;
})get()join(',');
alert("不同div下的li数量分别为："+num+",总数为："+tol+"。");
});
})
观察效果
jQuery的length 属性可以获取包含 jQuery 对象中元素的数目，所以获取input的个数可用如下代码实现
$('input')length; // 所有input的数量，包括文本框、单选按钮、复选框、隐藏域等$('input:text')length; // 文本框的数量
示例代码如下
创建Html元素
<div class="box"><span>点击按钮获取文本框数量：</span><br>
<div class="content">
<input type="text" name="name" value="John"/>
<input type="text" name="password" value="jack"/>
<input type="text" name="url" value="tom"/>
</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;}
input[type='button']{height:30px;margin:10px;padding:5px 10px;}
input[type='text']{width:200px;height:35px;padding:5px 10px;margin:5px 0;border:1px solid #ff9966;}
编写jquery代码
$(function(){$(":button")click(function() {
alert($("input:text")length);
})
})
观察效果
方法只有一种：
通过JQuery的class选择器方式。写法，选择器中2个class挨着写
示例
<div class='class1 class3'>class1+3</div>
<div class='class2 class3'>class2+3</div>
// 选第一个DIV的话 两个class挨着写，中间没有空格
$('class1class3')
以上就是关于jquery中怎么获取li的数量全部的内容，包括:jquery中怎么获取li的数量、Jquery怎么遍历div里面的div里面的ul的li数量，有代码求修改、如何用jquery获取当前页面中input的个数等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）