jQuery基础:处理多个选择结果(each迭代方法)
发布时间：2018-08-16 17:54:25 所属栏目：传媒 来源：站长网
导读：jQuery 提供.each()方法来对选中的结果进行循环处理，而且在每次执行函数时，都会给函数传递匹配元素在选中结果里所处位置的数字值作为参数（从零开始的整形变量）。返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循
|
jQuery提供.each()方法来对选中的结果进行循环处理，而且在每次执行函数时，都会给函数传递匹配元素在选中结果里所处位置的数字值作为参数（从零开始的整形变量）。返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。 例子一 <ul> <li>第一列</li> <li>第二列</li> <li>第三列</li> </ul> <button>选中所有列</button> //使用下面的jQuery代码，点击按钮后，所有列将被选择，并且在每列后加上index $(document).ready(function() { $('button').click(function(){ $('li').each(function(index){ var str = "<b>"+index+"</b>"; $("li:eq("+index+")").append(str); }); }); }); //注意：index是从零开始的整形变量。 例子二 <ul> <li>第一列</li> <li>第二列</li> <li class="mark">第三列</li> <li class="mark">第四列</li> </ul> <button>选择列</button> //使用下面的jQuery代码,点击按钮后，class为“mark”的列将被选择 $(document).ready(function() { $('button').click(function(){ $('li').each(function(index){ if ($(this).is(".mark")){ this.style.color = 'blue'; } }); }); }); //如果我们只想选第一个class为"mark"的列，可以使用return false，停止循环 $(document).ready(function() { $('button').click(function(){ $('li').each(function(index){ if ($(this).is(".mark")){ this.style.color = 'blue'; return false; //注意这个return } }); }); }); 注意：在上述例子里，我用到了$(this)和this, 前者是jQuery对象，后者是DOM对象。jQuery对象具有is方法，但不具有style方法，同理，DOM对象具有style方法，但不具有is方法。 （编辑：荆州站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
