萌新笔记：关于JQuery中的each()遍历与$.each()遍历

萌新笔记，适合新手，欢迎大佬指点_(^v^)

在jQuery中提供了很多遍历方法，其中each()遍历与$.each()遍历长得有点像，所以小白在此处做个笔记，区分以下这两个方法，方便自己以后复习。

在jQuery的api文档中是这样描述的：

	**each(callback):**
	以每一个匹配的元素作为上下文来执行一个函数。

• 意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数（从零开始的整型）。 返回 ‘false’ 将停止循环 (就像在普通的循环中使用 ‘break’)。返回 ‘true’ 跳至下一个循环(就像在普通的循环中使用’continue’)。
  

  $.each(object, [callback])
  通用例遍方法，可用于例遍对象和数组。

不同于例遍 jQuery 对象的 $().each() 方法，此方法可用于例遍任何对象。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。

通过概述对比可知：each() 用来遍历jQuery对象集合（重点是jQuery对象），而 ** $.each() ** 是个通用遍历方法，用于遍历对象和数组。使用each() 来遍历非jQuery对象时，应该先将其转换为jQuery对象： $(xxx).each([function]),"xxx"为非JQuery对象; $.each(object, [callback])可以直接使用。

例子相关链接：
https://blog.csdn.net/weixin_43322280/article/details/88649477

<script>
			$(function (){
				
				//2.建立省市二维数组
				var cities = new Array(2);
				cities[0] = new Array("兰州市", "敦煌市", "天水市", "白银市");
				cities[1] = new Array("西安市", "延安市", "咸阳市", "汉中市");
				
				//1.选择事件
				$("#province").change(function(){
					//10.每次事件开始先清空城市所在的select标签内容
					$("#city").empty();
					
					//4.获取option元素中省份对应的value
					var proVal = this.value;
					
/*					//3.遍历数组
					$(cities).each(function(i){
						$(cities[i]).each(function(j){
							
							//5.判断省份，对号入座
							if (proVal == i) {
								
							//6.创建一个城市文本节点
							var cityText = document.createTextNode(cities[i][j]);
							
							//7.创建一个option元素节点
							var optEle = document.createElement("option");
								
							//8.将文本节点插入元素节点
							$(optEle).append(cityText);
							
							//9.将option元素节点插入select父元素节点
							$("#city").append(optEle);
							}
						});
						
					});*/
					
					//3.遍历数组，用$.each(object, [callback])结构遍历
					
					$.each(cities, function(i, m){
						$.each(cities[i], function(j, n){
							
							//5.判断省份，对号入座
							if (proVal == i) {
								
							//6.创建一个城市文本节点
							var cityText = document.createTextNode(n);
							
							//7.创建一个option元素节点
							var optEle = document.createElement("option");
								
							//8.将文本节点插入元素节点
							$(optEle).append(cityText);
							
							//9.将option元素节点插入select父元素节点
							$("#city").append(optEle);
							}
						});
						
					});
					
				});
				
				
			});
		</script>