码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript排序

时间:2015-12-09 01:55:20      阅读:229      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> new document </title>
  <style type="text/css">
    #bg{
        height:100%;
        widht:100%;
        background-size:cover;
    }
  </style>

 </head>
 <body>
      <div  id="bg">
       <div id="source">
            <div>
                <span>30</span>
                <span>上海1</span>
                <span>cwg1</span>
           </div>
                <div>
                <span>27</span>
                <span>上海3</span>
                <span>cwg3</span>
           </div>
            <div>
                <span>32</span>
                <span>上海2</span>
                <span>cwg2</span>
           </div>
       </div>
    
        排序后:
       <div id="divResult">
      </div>
    
    </div>
    
 </body>
 <script type="text/javascript">
   // var bgDom = document.getElementById("bg");
   // bgDom.style.backgroundImage="url(‘1.jpg‘)";
   
    var source = document.getElementById("source")
    //    HTMLCollection对象
    var source =source.children;
    
    //将HTMLCollection对象转换成数组
    var sourceArr = Array.prototype.slice.call(source);
    
    console.info("----------");
    console.info(source.constructor);
    console.info(Object.prototype.toString.call(source));
    console.info( source instanceof  HTMLCollection);
    console.info(source);
    
    console.info("----------");
    console.info(sourceArr.constructor);
    console.info(Object.prototype.toString.call(sourceArr));
    console.info(sourceArr instanceof  Array);
    console.info(sourceArr);
    
    //对数组排序
    var sortArr =  sourceArr.sort(function(a,b){
        //alert(a.children[0].innerHTML +"--"+ b.children[0].innerHTML);
        //alert(a.getElementsByTagName("span")[0].innerHTML + "--" + b.getElementsByTagName("span")[0].innerHTML);
        
        var p1 = parseInt(a.getElementsByTagName("span")[0].innerHTML);
        var p2 = parseInt(b.getElementsByTagName("span")[0].innerHTML);
        if(p1>p2){
           return 1;
        }else {
           return -1;
        }
    });
    
    var divResult = document.getElementById("divResult");
    for(var i=0;i<sortArr.length;i++){
       //divResult.appendChild(sortArr[i]);
       //alert(sortArr[i].outerHTML);
     divResult.innerHTML +=sortArr[i].outerHTML;
    }
    
 
 
 
    
    
 
    
 </script>
</html>

JavaScript排序

标签:

原文地址:http://www.cnblogs.com/c2603/p/5031644.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!