jquery如何创建节点
日期：2014-05-16 浏览次数：20317 次
jquery怎么创建节点
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>1111</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<style type="text/css">
*{
list-style:none;
margin:0;
padding:0;
}
body{
font-size:12px;
}
/*清浮动*/
.clearfix:after{
content:"";
display:block;
clear:both;
}
.clearfix{
zoom:1;
}
.div{
width:785px;
margin:0 auto;
}
.div li{
width:146px;
float:left;
border:1px solid #DCDCDC;
margin:20px 20px;
display:inline;
}
.div li img{
margin:0 0 0 7px;
}
.div_zi,.div_title{
height:20px;
line-height:20px;
}
.div_title h3{
font-size:12px;
color:#313131;
float:left;
}
.div_title span{
float:left;
}
.title1{
float:left;
color:#00BCF3;
cursor:pointer;
}
.title2{
float:right;
color:#00BCF3;
cursor:pointer;
}
.tianjia{
width:147px;
height:178px;
background:#099;
text-align:center;
cursor:pointer;
line-height:178px;
}
.cj_tian{
width:400px;
height:200px;
border:1px solid #DCDCDC;
background:#FFF;
position:absolute;
left:50%;
top:50%;
margin-left:-200px;
margin-top:-100px;
display:none;
}
.cj_tian .cj_tian_head{
width:400px;
height:40px;
line-height:40px;
border-bottom:1px solid #DCDCDC;
}
.close{
float:right;
font-size:15px;
cursor:pointer;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$(".tianjia").click(function(){
$(".cj_tian").css('display','block');
})
$(".close").click(function(){
$(".cj_tian").css('display','none');
})
$(".quxiao").click(function(){
$(".cj_tian").css('display','none');
})
$(".queding").click(function(){
$(".cj_tian").css('display','none');
})
});
</script>
</head>
<body>
<div class="div">
<div class="cj_tian">
<div class="cj_tian_head">
<span class="fl">创建相册</span><span class="close">×</span>
</div>
<span>相册名称</span>
<input class="text" type="text" />
<input class="queding" type="button" value="确定"/>
<input class="quxiao" type="button" value="取消"/>
</div>
<div class=""></div>
<ul>
<li>
<img width="132" height="132" src="http://h.hiphotos.baidu.com/image/h%3D900%3Bcrop%3D0%2C0%2C1440%2C900/sign=d6836dcdd52a60594d10ed1a180f57e9/21a4462309f790521faec63a0ef3d7ca7bcbd505.jpg" />
<div class="div_title"><h3>商家图片</h3><span>(1张)</span></div>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
