• 締切済み

javascript バブルソート

javascriptでバブルソートの実装をしています。 リストにある数値を取得して昇順 or 降順したいのですがうまくいきません。 方法を教えていただけないでしょうか。 よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <script type="text/javascript"> function bubbleSort(){ var liVal = document.getElementsByTagName("li"); var array = []; for(var i = 0; i < liVal.length; i++){ for(var j = 0; j < liVal.length-i-1; j++){ array[j] = parseInt(liVal[j].innerHTML); if(array[j] > array[j+1]){ var n = array[j]; array[j] = array[j+1]; array[j+1] = n; } } } } </script> </head> <body> <ul> <li>10</li> <li>5</li> <li>48</li> <li>22</li> <li>679</li> </ul> <p><a href="javascript:void(0);" onclick="bubbleSort()">ソート(降順)</a></p> </body> </html>

みんなの回答

回答No.1

質問するときは「うまくいかない」じゃなくって こうなる想定だったのだが、こんなふうになっているにしないと、回答付きにくいよ。 まず、なぜ並び替えようとしているところで配列にliの値をとるのか。 先に取っておかないと。 function bubbleSort(){ var liVal = document.getElementsByTagName("li"); var array = []; for(var i = 0; i < liVal.length; i ++) array[i] = parseInt(liVal[i].innerHTML); for(var i = 0; i < array.length-1; i++){ for(var j = 0; j < liVal.length-i-1; j++){ if(array[j] > array[j+1]){ var n = array[j]; array[j] = array[j+1]; array[j+1] = n; } } } console.debug(array); } どこ直したかは自分で追ってみて。

関連するQ&A

  • javascriptに関する質問です。

    このコードを簡単に説明してください。 なぜあまりが0になると、JSが動作するのかがわかりません。 (child childrenのあたりも自分の頭がごちゃごちゃしています) よろしくお願いします。 <html> <head> <title>Hello DOM !</title> </head> <body> <div id="wrap"> <ul class="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> </ul> </div> <script type="text/javascript"> var children = document.querySelector("#wrap .list").children; for(var i=0;i<children.length;i++){ var child = children[i]; if(i%2){ child.style.backgroundColor = "#EEEEEE"; } } </script> </body> </html>

  • javascriptとhtmlでテーブル

    あの、分からないことがあります。 <UL>を使って表示したリストを今度はテーブルに埋め込みたいのですがどのようにしたら良いでしょうか?strUniversityで貯めた文字列をテーブルのヘッダーにしてfor文でarray内の値をULで表示してそれぞれをそれぞれのセルに入れて一つのテーブルを作りたいのですが失敗ばかりしてしまいます。 どのようにしたら良いでしょうか?宜しくお願いします。スクリーンショットとソースは以下に。 <HTML> <HEAD> <LINK href="global.css" rel="stylesheet" type="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"/> <title></title> </HEAD> <BODY> <script type="text/javascript"> document.title="Courses" //Print document title var strUniversity = "State University"; var arrCourses =new Array(5); arrCourses[0]="English"; arrCourses[1]="Music"; arrCourses[2]="Geography"; arrCourses[3]="Information Systems"; arrCourses[4]="Chemistry"; document.write(strUniversity.toUpperCase()+"<br/>"); for(i=0; i<5; i++) { document.write("<UL><LI>"+arrCourses[i]+"</LI></UL>"); } </script> </BODY> </HTML>

  • javascriptの2次元配列をソートの仕方

    function word_grouping(data) { var code = data; //先頭についている”code="を除去 code = code.replace("code=",""); var = code.split(","); var alpha =new Array(); alpha = ['A','B','C','D','E','F','G','H','I','J','K','L','M']; //2次元配列作成 var array = new Array(); for (i =0; i < alpha.length; i++) { array[i] = [' ','0']: } //グループ名を格納 for( i = 0; i <alpha.length; i++){ array[i][0] = alpha[i] //0番目の項目から順番にグループごとに分ける for( i = 0; i < sp.length; i++){ group = sp[i].substring(0.1); //どのグループに所属しているか調べる for( j = 0; j < alpha.length; j++){ //一致したグループの配列にカウント+1していく if(group == array[j][0]{ array[j][1]++; } } } メモ ・spにはグループのどこかに所属する20個のキーワードが入っていてそれをグループに振り分けている ・グループ分けには”A001”のAだけみて振り分けています したいこと ・arrayに入ったキーワードの数を降順で並び替えたい 分からない所 ・2次元配列をsortする仕方 こんな感じなんです わかる方回答お願いします。

  • ソート フォーム

    以前こちらで質問させていただいたものです。 ソートのできるリストについて質問し、大変ためになる回答をい忠美案した。今回、それを少々変更する必要があります。 ソートすべきリストの中にフォーム要素のチェックボックスを入れたいのですが、ソートするとチェックが消えてしまいます。 下記のようなコードですが、どのように修正すればよいでしょうか? どうかよろしくお願いいたします! <html> <head><style>span{border:1px solid;margin:4px}</style></head> <body> <ol> <li> <span><a href="#" onClick="narabi(this,0)">社名</a></span> <span><a href="#" onClick="narabi(this,1)">仕入値</a></span> <span><a href="#" onClick="narabi(this,2)">小売値</a></span> <span><a href="#" onClick="narabi(this,3)">会社ID</a></span> <span>備考(ソート不要)</span> </li> </ol> <ul> <li><span>ABC</span><span ><input type="checkbox"></span><span >200</span><span >1</span><span >テキスト(ソート不要)</span></li> <li><span>BBB</span><span ><input type="checkbox"></span><span >300</span><span >2</span><span >テキスト(ソート不要)</span></li> <li><span>XYZ</span><span ><input type="checkbox"></span><span >300</span><span >3</span><span ></span></li> <li><span>A-AA</span><span ><input type="checkbox"></span><span >120</span><span >4</span><span >テキスト(ソート不要)</span></li> <li><span>A-17</span><span ><input type="checkbox"></span><span >200</span><span >5</span><span >テキスト(ソート不要)</span></li> </ul> </body> <script> var af=[]; function narabi(ob,cidx){ af[cidx]=af[cidx]?0:1; var dt=[]; var tg=parentSearch(ob,'OL').nextSibling; var li=tg.getElementsByTagName('li'); for(var i=0,m=li.length;i<m;i++){ var sp = li[i].getElementsByTagName('span'); dt[i]=sp[cidx].innerHTML+'|'; for(var j=0;j<4;j++) dt[i]+=sp[j].innerHTML+'|'; } dt.sort();if(af[cidx]) dt.reverse(); for(var i=0,m=dt.length;i<m;i++){ var sp = dt[i].split('|'); for(var j=0;j<4;j++) li[i].getElementsByTagName('span')[j].innerHTML=sp[j+1]; } } function parentSearch(o,t){while(o.tagName!=t)o=o.parentNode;return o;} </script> </html>

  • スクリプトで<div id="links">

    下記スクリプトで<div id="links"></div>のところを 開いた瞬間 <ul> <li><a href="http://foo.com/">foo</a></li> <li><a href="http://bar.com/">bar</a></li> </ul> に変換したいのですがうまくいきません どこをどのように変更すれば変換されるのでしょうか 【スクリプト】 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script type="text/javascript"> var URL = new Array("http://foo.com/","http://bar.co.jp/"); var TITLE = new Array("foo","bar"); // 表示用コンテナ var container = document.getElementById('links'); // リセット container.innerHTML=''; var ul=document.createElement('ul'); container.appendChild(ul); for(var i=0;i<URL.length;i++){ var li=document.createElement('li'); var a=document.createElement('a'); // 'href'属性の設定 a.setAttribute('href',URL[i]); // ラベル a.appendChild(document.createTextNode(TITLE[i])); li.appendChild(a); ul.appendChild(li); } </script> </head> <body> <div id="links"></div> </body> </html>

  • javascriptとCSSを使ってのドロップダウンメニュー作成

    CSSとJavaScriptを使って ドロップダウンメニューを作ろうと思っているのですが JavaScriptがうまく作動していないためか FireFoxでは表示されるのですが IE6では動きません。 ご教授お願い致します。 ■index.html <head> <script src="javascript/menu.js" type="text/javascript"></script> </head> <div id="nav"> <ul> <li id="category"><a href="~">category</a> <ul> <li><a href="~">Overview</a></li> <li><a href="~">Overview</a></li> </ul> <ul> <li id="category"><a href="~">category</a> <ul> <li><a href="~">Overview</a></li> <li><a href="~">Overview</a></li> </ul> </div> ■menu.js function menuHover() {var menuItems = d.getElementById("nav").getElementsByTagName("li"); for (var i = 0, miL = menuItems.length; i < miL; i++) { menuItems[i].onmouseover = function() { this.className = "mnhover"; } menuItems[i].onmouseout = function() { this.className = ""; } window.onload = menuHover();

  • javascriptについて

    javascriptに関してまだまだ初心者で困っております. 作成したいプログラムは,画像をクリックすると,クリックした画像だけが"on.gif"になり,それ以外の画像は"off.gif"となるようなプログラムです. そこで以下のようなプログラムを作成したのですが,うまく動きません. ご助言頂ければ幸いです. <html> <head> <script type="text/javascript> <!-- function changeImg(no){ for (i=1; i<3; i++){ document.image[i].src = "off.gif"; if(i==no) document.image[i].src = "on.gif"; } } //--> </script> </head> <body> <ul> <li><a href="JavaScript:changeImg(1)"><img src="on.gif" name="image[1]" /></a></li> <li><a href="JavaScript:changeImg(2)"><img src="off.gif" name="image[2]" /></a></li> </ul> </body> </html>

  • JavaScriptで九九

    繰り返し処理を用いて画像のように表示させたい場合はどこを修正すればいいですか? <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>九九</title> </head> <body> <script> for (var i = 1; i <= 9; i++) { for (var j = 1; j <= 9; j++) { document.write(`${i} * ${j} = ${i*j}<br/>`); } } </script> </body> </html>

  • java(バブルソート/単純挿入ソート)

    以下のプログラムを「バブルソートもしくは単純挿入ソートのプログラムに変更しなさい」という課題が出ました。 どのようにすればよろしいでしょうか? import java.util.*; public class SelectSort { //プログラムクラス名 //整列プログラム public static void main(String[] args){ //整列用 int 型配列 int[] target; int elems = KeyboardInput.askInt("要素数? "); //配列を乱数で初期化する target = setArray(elems); //初期状態を表示 display(target); //整列メソッドの呼び出し sortArray(target); //整列結果の表示 display(target); } //配列を乱数で初期化するメソッド static int[] setArray(int elems){ // 要素数個の int 型変数の確保 int[] array = new int[elems]; //乱数利用ための宣言 Random generator = new Random(); //乱数の最大値・最小値 int max = 100; int min = 0; //generator.nextDouble() で 0から1までのdouble型乱数発生 for(int i=0 ; i<array.length ; i++) { array[i] = (int)((max-min)*(generator.nextDouble())+min); } return array; } //配列の状態を表示 static void display(int[] array){ for(int i=0 ; i<array.length ; i++) { System.out.print(array[i]+" "); } System.out.println(""); } static void sortArray(int[] array){ //配列のはじめから最後まで繰り返す for( int i = 0; i < array.length-1 ; i++){ int min_id = i; int min = array[i]; //範囲中でもっとも小さい要素を探す for( int j=i+1 ; j< array.length ; j++ ) { if( array[j] < min ){ min = array[j]; min_id = j ; } } //範囲の始めと置き換える int tmp = array[i]; array[i] = array[min_id]; array[min_id] = tmp; //display(array); } } }

  • 【javascript】ハッシュのキーをソートして取り出したい

    ハッシュのキーをソートして取り出したいです。 perlで表現すると、以下の様なかんじです。 foreach $key (sort keys %hash) { ... } そこで、prototype.jsを使って以下の様に書いてみました。 <html> <head> <script type="text/javascript" src="prototype.js"></script> </head> <body > <script > var table = {c:'C', b:'B', a:'A'}; $H(table).keys().sort().each(function(key){ alert(key + ' ' + table[key]); }); </script> </body> </html> 他に良い方法ありましたら、教えてください。

専門家に質問してみよう