Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    [Z]
    [Z] is offline
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Sorting SPANs by innerText, how?

    Hi,
    how could I sort SPANs by its innerText (IE)?

    Page code:

    <DIV id=d1>
    <SPAN id=sp1>aaa</SPAN><BR>
    <SPAN id=sp2>zzz</SPAN><BR>
    <SPAN id=sp3>ccc</SPAN><BR>
    </DIV>

    I want to change d1 innerHTML on body onload event (don't ask me why not before), spans should be sorted:

    <DIV id=d1>
    <SPAN id=sp1>aaa</SPAN><BR>
    <SPAN id=sp2>ccc</SPAN><BR>
    <SPAN id=sp3>zzz</SPAN><BR>
    </DIV>

    TIA

  • #2
    Regular Coder
    Join Date
    Feb 2005
    Posts
    400
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    function spanSort(){
      var a=[],s=document.getElementsByTagName('span');
      for(var i=0;i<s.length;i++)
        a[i]=s[i].innerHTML;
      a.sort();
      for(i=0;i<s.length;i++)
        s[i].innerHTML=a[i];
      }

  • #3
    [Z]
    [Z] is offline
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Harry Armadillo
    Code:
    function spanSort(){
      var a=[],s=document.getElementsByTagName('span');
      for(var i=0;i<s.length;i++)
        a[i]=s[i].innerHTML;
      a.sort();
      for(i=0;i<s.length;i++)
        s[i].innerHTML=a[i];
      }
    Thanks that did it. You've made my day...

  • #4
    [Z]
    [Z] is offline
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by [Z]
    Thanks that did it. You've made my day...
    But... I want to sort by innerText only, outer/innerHTML sorting depends on SPANs IDs...

    ???

    <DIV id=d1>
    <SPAN id=aaasEjd>www</SPAN><BR>
    <SPAN id=a1Dsfsp1>aaa</SPAN><BR>
    <SPAN id=zdsEjd>ccc</SPAN><BR>
    <SPAN id=bds2s>zzz</SPAN><BR>
    </DIV>

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Do you really need id's?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    [Z]
    [Z] is offline
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Kor
    Do you really need id's?
    Absolutely! That's a specific js-project... I guess I've solved the problem.

    function F(){
    var a=[],s=document.getElementsByTagName('span');
    for(var i=0;i<s.length;i++)a[i]=s[i].outerHTML;
    a.sort(C)
    for(i=0;i<s.length;i++)s[i].outerHTML=a[i];
    }

    function C(a,b){
    alert(a.replace(/\<s.+?>/i,''))
    if(String(a.replace(/\<s.+?>/i,'')) < String(b.replace(/\<s.+?>/i,'')))return -1;
    if (String(a.replace(/\<s.+?>/i,'')) > String(b.replace(/\<s.+?>/i,'')))return 1;
    return 0;
    }

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Alternative (cross-browser) solution using "2D" array:
    Code:
    function spanSort(){
      var a=[],s=document.getElementsByTagName('span');
      for(var i=0;i<s.length;i++)
        a[i] = [s[i].id, s[i].innerHTML];
      a.sort(
        function(a,b){
          if(a[1] < b[1]) 
            return -1; 
          if(a[1] > b[1]) 
            return 1;
          return 0;
        }
      );
      for(i=0;i<s.length;i++){
        s[i].id=a[i][0];
        s[i].innerHTML=a[i][1];
      }
    }
    This works cross-browser as it doesn't use the IE-proprietary property outerHTML.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #8
    [Z]
    [Z] is offline
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by glenngv
    Alternative (cross-browser) solution using "2D" array:
    This works cross-browser as it doesn't use the IE-proprietary property outerHTML.
    Thanks a lot!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •