html5冒泡排序代码,Html5 冒泡排序演示(示例代码)

1

2

3

4

The nineth html page

5

6 ul li7 {

8 list-style-type:georgian;

9 text-align:left;

10 }

11 .mark12 {

13 width:140px;

14 height:40px;

15 color:Olive;

16 text-align:center;

17 line-height:40px;

18 margin:5px;

19 float:left;

20 }

21 .redball22 {

23 width:40px;

24 height:40px;

25 border-radius:20px;

26 background-color:Red;

27 text-align:center;

28 line-height:40px;

29 margin:5px;

30 float:left;

31 }

32 .ball33 {

34 width:40px;

35 height:40px;

36 border-radius:20px;

37 background-color:Aqua;

38 text-align:center;

39 line-height:40px;

40 margin:5px;

41 float:left;

42 }

43 .line44 {

45 clear:left;

46 }

47 header48 {

49 height:80px;

50 border:1px solid gray;

51 }

52 .left53 {

54 border:1px solid gray;

55 float:left;

56 width:30%;

57 height:480px;

58 margin-left:0px;

59 margin-right:0px;

60

61 }

62 aside63 {

64 text-align:center;

65 }

66 section67 {

68 width:69.5%;

69 float:left;

70 height:480px;

71 border:1px solid gray;

72 margin-left:0px;

73 margin-right:0px;

74 }

75 footer76 {

77 clear:left;

78 height:60px;

79 border:1px solid gray;

80 }

81 input[type="button"]82 {

83 width:80px;

84 text-align:center;

85 margin-top:10px;

86 }

87

88

89 functioninitDiv() {90 varmainArea=document.getElementById("mainArea");91 for(vari= 0; i< 8; i++) {92 varnewDivLine=document.createElement("div");93 newDivLine.setAttribute("class","line");94 mainArea.appendChild(newDivLine);95 for(varj= 0; j< 9; j++) {96 varnewDiv=document.createElement("div");97 varid=i.toString()+j.toString();98 newDiv.setAttribute("id", id);99 if(j<8){100 newDiv.setAttribute("class","ball");101 }else{102 newDiv.setAttribute("class","mark");103 }104 newDivLine.appendChild(newDiv);105 }106 }107 }108

109 //初始元素赋值

110 vararrTmp=[4,6,8,7,9,2,10,1];111 functionsetElementsValue() {112 for(vari= 0; i

118 //冒泡排序

119 functionsetBubbleSortValue() {120 for(vari= 0; iarrTmp[j+ 1]) {123 vartmp=arrTmp[j+ 1];124 arrTmp[j+ 1]=arrTmp[j];125 arrTmp[j]=tmp;126 }127 }128 //显示出来

129 for(vark= 0; k

139

140

141

142

143

Bubble Sort Demo

144

145

146

147

148

149

150

151

152

153

冒泡排序(Bubble Sort

154

155

比较相邻的元素。如果第一个比第二个大，就交换他们两个。

156

对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。在这一点，最后的元素应该会是最大的数。

157

针对所有的元素重复以上的步骤，除了最后一个。

158

持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较