<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>main</title>
<script type="text/javascript" src="../jquery/jquery-1.7.js"></script>
<script type="text/javascript">
  
//给QJuery区个别名 为了不和别人冲突
var Q=jQuery.noConflict();
var min = {'height':'20px',};
var max={'margin-left':'10px','margin-top':'10px','float':'left','height':'100px','width':'200px','background':'darkgray'}
var x=0;      
Q(document).ready(
function(){
Q(".vis").click(function(){
x  = x+1;  
  if(x%2 != 0){
Q("#t").hide(); 
Q("#c").css(min);
  }
else if(x%2==0){
Q("#c").css(max);
Q("#t").show(); 
}
}); 
});
          
Q(document).ready(
  function(){
  var w = Q("#5").clone();
Q("button").click(function(){
      Q("#head").append(w);  
   alert(w);
});}
);
</script> <style type="text/css">
body {

font-size:12px; 
       margin:0;
       padding:0;
       background:lightcyan;
       }

#head { 
position:relative; 
margin: auto;         /*---页面居中的写法------*/
width:900px;        /*----加了宽度效果就看得出了,原来是全屏的-----*/
}



.bb {
margin-left: 10px;
margin-top:10px;
float:left;
height:100px;
width: 200px;
background:darkgray;
}  
</style>
</head> 
<body id = "begin">
<div id="head">
  <div class="bb"   id="c">
   1  
   <div style="float: right">   
   <img class ="vis" src="../img/min.jpg" style="width: 17px; height: 15px;"/>&nbsp;
     <img src="../img/close.jpg" style="width: 17px; height: 15px;"/><br />
   </div>
   <div id ="t" >sdfsdfdsf</div>
  </div>
  <div class="bb">2</div>   
  <div class="bb">3</div>
  <div class="bb">4</div>
  <div class="bb" id ="5">5</div>  
</div>
<button type="button">Click me</button>
</body>
</html>

解决方案 »

  1.   

    append(content)
    概述
    向每个匹配的元素内部追加内容。
    这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似。
    HTML 代码:
    <p>I would like to say: </p>jQuery 代码:
    $("p").append("<b>Hello</b>");结果:
    [ <p>I would like to say: <b>Hello</b></p> ]上面API描述,就是在指定内容后面追加,不就是按顺序追加么,你想说明啥呢?
      

  2.   

    我现在想 添加点一下按钮 就添加一个div  但是不行 
      

  3.   

    用我下列这段代码去测试,自己看下效果就明白了。
    <script type="text/javascript">
    var i =1;
    $(function(){
        $("button").click(function(){
           $("#head").append("<div>我是添加的第"+i+"个DIV</div>");
        });
    });
    </script>
      

  4.   

    哈哈 搞定了 怎么我追加成功了 但是图片的事件怎么办呀 !!!  怎么才能让追加的div 图片事件也能生效呢?