나는 인터뷰 에서이 질문에 대해 물었다 코드 조각 :
다음은 코드입니다.
index.html <! doctype html> <html> <head> <title> 정렬> <링크 로스 = "스타일"유형 = "text/css"href = "style.csss"> </head> < > <!-메인 페이지 구조-> <div> <입력 유형 = "text"name = "number"id = "number"placeholder = "10 숫자를 입력하십시오 (공간을 떠나지 마십시오)" /<at href = " javaScript : void () "id ="idectbtn "> 정렬 </a> <label> 정렬 후 : </label> <!-다음 세 가지 레이블이 표시, 삽입 및 신속하게 results--> <label for = "bubblesort"> </label> <label for = "insertsort"> </label> <label for = "quicksort"> </label> </div> <!-end-> <script type = "text/javaScript "src ="script.js "> </script> </body> </html>
이 페이지에 몇 가지 스타일을 작성하십시오. 그렇지 않으면 너무 나빠질 것입니다.
style.css *{마진 : 0; 40px; 텍스트-중심; : 블랙 컬러;그런 다음 주요 기능 구현이 있습니다.
script.jswindow.onload = function () {var btn = getElementById ( "resultBtn"); ( "레이블"); // 결과는 var i, j, temp를 표시합니다. // bubble stinting varuck = fort (i = 0; i <9; i ++) {for (j = 0. 0 0 0 0 0 0 0; J <9-i; [j+1], arr [j+1] = temp;}}} return arr;} // 정렬 var insersort = function (arch) {for (i = 1; i <10; i ++) { 온도 = j = i; } arr;} // var QuickSort = var vase, var right = [arr.length <= 1); 위치 baseeNumIndex = arr.length // 2); i] <vasenum) {left.push (arr [i]);} else {right.push (arr [i]);} // 재귀 적으로 return quicksort (left) .concat ([basenum], Quicksort (오른쪽) ); 기능 isnum (num) {var renum =/^[0-9]+$/; 입력 유형 및 길이와 공기의 길이 (! isnum.value) || inputnum.length> 10 || 10) {resultlbl [0] .innerhtml = "당신의 형식은 ing! [10 숫자]"; 정렬 : "lbl [0] .style.color ="black "; var inputStream = inputnum.value.toString (); // 입력 내용을 문자열로 변환 var data = inputStream.split (" "); 변환 된 문자열은 배열로 변환하는 것과 동일합니다. // 결과 출력 resultlbl [1] .innerhtml = "bubblesort :" + "<br/" + bubble (data); + "<br/>" + insert (data);마지막 효과는 이것입니다.
입력, 조용한 텍스트 상자, 조용한 버튼 및 라벨없이 :
입력은 숫자가 아니거나 10 개 이상 10을 초과하지 않거나 버튼을 클릭하면 오류가 표시됩니다.
빈 :
숫자와 10 자리 미만 :
10 자리 이상 :
올바른 입력의 경우 :
팁 : 입력 번호 사이에 빈 그리드를 추가 할 필요가 없으며 입력 번호 사이에 빈 그리드를 추가 할 필요가 없습니다.
텍스트 상자에 입력 된 숫자는 1 자리 (0-9) 일 수 있습니다. 이 내용이 모든 사람에게 도움이되기를 바랍니다.