对于有规律的数据,我们经常需要使用到遍历来进行处理。在jquery中,我们可以使用each()方法来实现。
//假设我们有以下结构的html<ul id="list"><li>item1</li><li>item2</li><li>item3</li><li>item4</li></ul>//如果我们想要遍历这些li元素并打印出它们的文本内容,可以这样写:$(#list li).each(function(){console.log($(this).text());});
上面的代码中,我们首先选中所有的li元素,然后针对每一个li元素,都执行一遍each()中的回调函数。在回调函数中,this关键字指向当前的li元素,我们通过$(this)的方式将其转化为jquery对象,然后就可以访问它的文本内容,进行打印等操作了。
如果我们有规律的数据,并且需要根据规律去处理数据,也可以使用each()方法。比如,我们有一组表单元素,它们的id都是以“input_”为前缀,并且后面跟着一个数字(从1开始递增)。如果我们想要将所有input中的值都加上5,可以这样写:
<input type="text" id="input_1" /><input type="text" id="input_2" /><input type="text" id="input_3" /><input type="text" id="input_4" />//遍历所有input$([id^="input_"]).each(function(){var value = parseInt($(this).val()); //获取当前input的值$(this).val(value+5); //将值加上5并重新赋值});
在上面的代码中,我们使用了jquery的属性选择器来选中所有id以“input_”开头的元素,然后对每个元素执行each()回调函数。在回调函数中,我们首先获取当前input元素的值,并将其转化为数字类型。然后将值加上5,并重新赋值给input元素,实现了每个元素都加上5的效果。