JQuery中each解析

最新推荐文章于 2024-05-05 05:59:37 发布

絮飘

最新推荐文章于 2024-05-05 05:59:37 发布

阅读量710

点赞数

分类专栏： Jquery

本文链接：https://blog.csdn.net/comeonj/article/details/19625335

版权

Jquery 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<style type="text/css">
.red{ background:Red;}
</style>
<script src="../js/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("input:[name=names]").click(function(){
$(this).attr("class","red");
var arr=new Array();
$("input:checked").each(function(key,value){
arr[key]=$(value).val();
});
$("#initInfo").html(arr.join(","));
});
var links="<p><a href='http://www.baidu.com'>百度</a></p>";
//links.text("摆渡");
$("#initInfo").append(links);
});


$(function(){
var data={"百度":"http://www.baidu.com","新浪":"http://www.sina.com"};
$.each(data,function(key,value){
var tr="<tr><td>"+key+"</td><td><a href="+value+">"+key+"</a></td><tr>";
$("#table1").append(tr);
});
var s=$("#redinfo li[class=red]").remove();
$("#redinfo").append(s);
//$("#redinfo li[class=red]").removeClass("red");

});
</script>
</head>
<body>
<input type="checkbox" name="names" value="tom" />tom
<input type="checkbox" name="names" value="jom" />jom
<input type="checkbox" name="names" value="ss" />ss
<input type="checkbox" name="names" value="dd" />dd
<input type="checkbox" name="names" value="ff" />ff
<p id="initInfo"></p>

<table id="table1">

</table>
<ul id="redinfo">
<li>11</li>
<li class="red">22</li>
<li>33</li>
<li class="red">44</li>
<li>55</li>
</ul>
</body>
</html>