您的位置：首页 > 其它

弹窗选择 / 左到右 / 右到结果集 / 关键知识点小记录

2017-11-06 00:00 162 查看

数组和对象的混合遍历 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>数组和对象混合遍历</title>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
<div id="reasult-list">
<ul>

</ul>
</div>
</body>
</html>

<script type="text/javascript">
$(function(){
var obj = {
name01:"奔驰",
name02:"宝马",
name03:"奥迪"
}
//console.log(obj)

//第一种：将对象中的数据，逐条追加到数组中，然后合并数组，赛到dom中。
var inner = [];
for (var x in obj) {
alert(x)  //遍历的是键；
inner.push('<li data-id="' + x + '">' + obj[x] + '</li>'); //尾部添加
console.log(inner)
}
$('#reasult-list ul').html(inner.join(''));

//第二种：直接遍历到dom中
//      for (var y in obj) {
//      	$('#reasult-list ul').append('<li data-id="' + y + '">' + obj[y] + '</li>')
//      }

})
</script>


$.extend ( 实际是合并，合并遵循的原则如下：)

是对象合并；会改变结构；

相同值,后者覆盖前者;

多的键值对，以后者为准。多的删除。

<script type="text/javascript">
$(function(){
var Css1={size: "10px",style: "dot"}
var Css2={size: "12px",style: "solid",weight: "bolder"}
$.extend(Css1,Css2) ;
console.log("合并后的对象如下")
console.log(Css2);            //返回: {size: "12px", style: "solid", weight: "bolder"}

//console.log("合并后的对象如下"+Css2) //字符串与对象不能拼接

//extend,
//		1,是对象合并；会改变结构；
//		2,相同值,后者覆盖前者;
//		3,多的键值对，以后者为准。多的删除。
})
</script>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航