基本上全部加了注释,一行一注....呵呵 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>数组排序</title> <mce:style type="text/css"><!-- body{ font-family:宋体; font-size:9pt; background:#EDEDED; } h2 { font-weight:normal; font-size:18px; text-align:center; background:#fff; border:solid 1px #B8B8B8; padding:15px 15px 10px 15px; } #InputArr { width: 218px; } #Show { margin-top:20px; width:40%; min-height:100px; height:auto; padding:10px; background:white; border:dashed 1px #B8B8B8; } --></mce:style><style type="text/css" mce_bogus="1">body{ font-family:宋体; font-size:9pt; background:#EDEDED; } h2 { font-weight:normal; font-size:18px; text-align:center; background:#fff; border:solid 1px #B8B8B8; padding:15px 15px 10px 15px; } #InputArr { width: 218px; } #Show { margin-top:20px; width:40%; min-height:100px; height:auto; padding:10px; background:white; border:dashed 1px #B8B8B8; }</style> </head> <body> <h2>定义一个包含6个元素的整型数组并赋值，然后使用冒泡排序法进行排序，并将每一轮的排序结果显示出来</h2> <mce:script type="text/javascript"><!-- //数组排序类 function BubleSort() { //数组成员 BubleSort.prototype.Nums = new Array(); //排序历史记录 BubleSort.prototype.Hostory = ""; //防止用户重复点击排序造成 历史记录字段重复叠加 BubleSort.prototype.Flag = true; //定义赋值给[数组成员]的方法.这里是以空格来分割字符串为数组的 BubleSort.prototype.SetArr = function(_str) { //定义一个变量获取分割后的数组 var NumsArr = _str.split(" "); //循环赋值 循环的时候需要转换 用到了parseInt这个函数 for (var i = 0; i < NumsArr.length; i++) { //赋值 等于说把分割后的这个数组变量给复制到当前类的 数组成员 里 this.Nums[i] = parseInt(NumsArr[i]); } } //获取(return当前类的 数组成员) BubleSort.prototype.GetArr = function() { return this.Nums.toString(); } //冒泡排序法 BubleSort.prototype.SortArr = function() { //加判断 防止重复排序 其实重复排序也没什么 主要是历史记录不断增加... if (!this.Flag) { //如果是重复排序给出提示 alert("已经排序完毕了！"); //返回 return false; } //定义中转变量 var Temp; //俩个循环完成冒泡 for (var i = 0; i < this.Nums.length; i++) { for (var j = this.Nums.length - 1; j > i; j--) { if (this.Nums[j] > this.Nums[j - 1]) { Temp = this.Nums[j]; this.Nums[j] = this.Nums[j - 1]; this.Nums[j - 1] = Temp; } this.Hostory += "第{" + i + "}次 排序后：" + this.Nums[j] + "<br/>"; } } //冒泡完后把类里的这个 成员 改成false 代表应经排过序了 this.Flag = false; } //反转数组 BubleSort.prototype.ReverseArr = function() { //定义一个中转变量 var Temp; //此方法摘抄自网络(循环次数为当前数组长度的/2倍) //调换方法一次是 第一个和最后一个对换、第二个和倒数第二个对换、第三个和倒数第三个对换......等等 for (var i = 0; i < this.Nums.length / 2; i++) { Temp = this.Nums[i]; this.Nums[i] = this.Nums[this.Nums.length - (i+1)]; this.Nums[this.Nums.length - (i+1)] = Temp; } } } //实例化对象 NEW一个 var b = new BubleSort(); //进行排序 并调用 输出方法 function Button_click_Sort() { //获取输入框内容 var str = document.getElementById("InputArr").value; //长度小于1 肯定是每输入了 所以返回不做 if (str.length < 1) {alert("为输入任何数字!");return false;} //赋值 b.SetArr(str); //排序 b.SortArr(); //显示 ShowArr(); } //进行排序 并调用 输出方法 function Button_click_ReverseArr() { //反转 b.ReverseArr(); //显示 ShowArr(); } //输出排序后的内容 的方法 function ShowArr() { //获取数组 判断长度小于1返回不做 if (b.GetArr().length < 1) { alert("当前并没有数组数据！"); return false; } //显示反序后的数组 用ID为"Show"的这个标签来显示 document.getElementById("Show").innerHTML = b.GetArr(); } //输出排序的历史记录 function ShowArrHostory() { //如果历史记录长度小于1 返回不做 if (b.Hostory.length < 1) { alert("当前并没有数组数据！"); return false; } //显示历史记录 document.getElementById("Show").innerHTML = b.Hostory; //清空历史记录 b.Hostory = ""; //设置排序开关为开启 (写到这里其实开始分细点 单独写一个清空排序历史、设置排序开关 等等...) b.Flag = true; } //清空显示记录 function RemoveShowDiv() { document.getElementById("Show").innerHTML =""; } // --></mce:script> <label id="Label1"> 要排序的数组(输入是用空格分开 如 19 18 23)</label> <input type="text" id="InputArr" /> <br /><br /> <input type="button" οnclick="Button_click_Sort()" value="排 序" /> <input type="button" οnclick="Button_click_ReverseArr()" value="反 转" /> <input type="button" οnclick="ShowArrHostory()" value="排序记录" /> <input type="button" οnclick="RemoveShowDiv()" value="清空显示" /> <div id="Show"></div> </body> </html>
扫一扫
473
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
