Maison > Article > interface Web > Trois méthodes de parcours de chacun dans Jquery
Les trois méthodes de parcours de chacune dans Jquery vous montreront l'utilité de chaque méthode de jquery, ce qui est très utile pour jquerySi vous êtes intéressé, vous pouvez l'enregistrer et y jeter un œil !
1. Sélecteur + parcours
$('div').each(function (i){
i est la valeur de l'index
cela signifie obtenir et parcourir chaque objet DOM
});
2 Sélecteur + traversée
$('div' ) .each(function (index,domEle){
index est la valeur de l'index
domEle signifie obtenir et parcourir chaque objet dom
});
3. Une méthode de parcours plus applicable
1) Obtenez d'abord un objet de collection
2) Parcourez chaque élément de l'objet de collection
var d = $("div");
$.each(d,function (index,domEle){
d est la collection à parcourir
index est la valeur de l'index
domEle signifie parcourir chaque paire de dom
});
<!DOCTYPE html > <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>属性选择器学习</title> <script language="JavaScript" type="text/javascript" src="jquery-1.7.1.min.js"></script> <script language="javascript" type="text/javascript"> //使用jquery加载事件 $(document).ready(function (){ $("#btn0").click(function (){ //当点击按钮后,设置id=two的div的背景颜色是绿色 $("input[type=text]:enabled").each(function(index,domEle){ //domEle.value="xxxxx"; $(domEle).val("xxxxxxxx"); }); }); $("#btn1").click(function (){ //当点击按钮后,设置id=two的div的背景颜色是绿色 $("input[type=text]:disabled").each(function(index,domEle){ //domEle.value="xxxxx"; $(domEle).val("xxxxxxxx"); }); }); $("#btn2").click(function (){ //当点击按钮后,设置id=two的div的背景颜色是绿色 alert($("input[type=checkbox]:checked").length); }); $("#btn3").click(function (){ //当点击按钮后,设置id=two的div的背景颜色是绿色 $("select option:selected").each(function(index,domEle){ //domEle.value="xxxxx"; alert($(domEle).text()); }); }); }); </script> </head> <body> <form method="post" action=""> <input type="text" value="可见元素1" /> <input type="text" value="不可见元素1" disabled="disabled" /> <input type="text" value="可见元素2" /> <input type="text" value="不可见元素2" disabled="disabled" /><br> <input type="checkbox" value="美女" />美女 <input type="checkbox" value="美男" />美男 <input type="checkbox" value="大爷" />大爷 <input type="checkbox" value="大妈" />大妈 <br> <input type="radio" value="男" />男 <input type="radio" value="女" />女 <br> <select id="zhiwei" size="5" multiple="multiple"> <option>php开发工程师</option> <option>数据库管理员</option> <option>系统分析师</option> <option>保安</option> </select> <select id="xueli"> <option>大专</option> <option>中专</option> <option>小学</option> </select> </form> <div style="clear:both;"> <input id="btn0" type="button" value="利用jquery对象实现 修改表单中可修改的文本域的值 $('input[type=text]:enabled')" /><br> <input id="btn1" type="button" value="利用jquery对象实现 修改表单中不可修改的文本域的值 $('input[type=text]:disabled')" /><br> <input id="btn2" type="button" value="利用jquery对象实现 获取选中的复选框的个数 $('input[type=checkbox]:checked')" /><br> <input id="btn3" type="button" value="利用jquery对象实现 获取选中的下拉菜单的内容 $('select option:selected')" /><br> </div> </body> </html>
Ce qui précède est une brève description et une démonstration de code des trois méthodes de traversée de chacune dans Jquery.
Recommandations associées :
JQuery simule les événements de clic et déclenche automatiquement les événements
Comment utiliser jquery efficacement
jquery pour simuler l'effet d'invite de titre
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!