javascript实现-冒泡排序算法

本文提供了一个使用JavaScript实现的冒泡排序算法示例,通过DOM操作实现数组排序并展示结果,有助于理解冒泡排序的基本原理。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

//以下代码是自己用冒泡算法结合dom操作实现的排序操作。 熟悉js功能的朋友可以直接用sort()内置函数实现数组的排序,此方法是自己写的冒泡排序,有助于理解算法的思想.

代码可直接复制使用,已经优化精简//

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>冒泡排序</title>
    <style type="text/css">
    body{color:#999;font:12px/1.5 Tahoma;}
    #outer{width:500px;margin:0 auto;}
    #outer input{padding:3px;border:1px solid #ccc;
    font-family:inherit;width:220px;margin-right:10px;}
    .show{font-size:30px;color:red;}
</style>
</head>
<body>
<div id="outer">
    <label>
    <input type="text" value="" /> 
    <span>输入数字排序,数字之间用半角","号分隔</span>
    </label>
    <p><input type="button" name="" value="一键排序"/></p>
    <p id="show" class="sort"></p>
</div>

<script type="text/javascript">
    (function(){
        //首先通过基本的dom操作取得文本框里的值
        var $ = function(id){
            return document.getElementById(id);
        }
        //取到相应的dom节点
        var myInput = $("outer").getElementsByTagName("input");
        var showSort = $("show");

        myInput[1].onclick=function(){
            //将输入的数值用,分割开来,split可以直接把字符串返回成字符串数组.
            var nums = myInput[0].value.split(",");
            showSort.innerHTML = bubbleSort(nums);
        }

        //冒泡排序的函数,自己可以调整正序或倒序,输入一个数组参数,得到返回值
        function bubbleSort(arr){
            for(var i=0;i<arr.length;i++){
                for(var j=0,t=0;j<arr.length-1;j++){
                    if(arr[j]>arr[j+1]){
                        t = arr[j];
                        arr[j]=arr[j+1];
                        arr[j+1] =t;
                    }
                }
            }
            return arr;
        }
})();
</script>
</body>
</html>
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值