随机清空Javascript数组_Javascript_Arrays

随机清空Javascript数组

javascript arrays

随机清空Javascript数组,javascript,arrays,Javascript,Arrays,我试图用一系列按钮onclick事件清空一个数组如何将新拼接的阵列访问到在其上运行相同的函数，直到不再有字母这是我正在使用的代码： PS，我感谢社区、评论、说明和帮助，但是如果你想告诉我代码有多不合适，请考虑重写它，以便每个人都能以正确的方式学习 <body> <button onClick="myFunction()">CLick</button> </br> <div id="myDiv"></div> <

我试图用一系列按钮onclick事件清空一个数组

如何将新拼接的阵列访问到在其上运行相同的函数，直到不再有字母

这是我正在使用的代码：

PS，我感谢社区、评论、说明和帮助，但是如果你想告诉我代码有多不合适，请考虑重写它，以便每个人都能以正确的方式学习

<body>

<button onClick="myFunction()">CLick</button>

</br>
<div id="myDiv"></div>
<div id="myDiv1"></div>

<button onClick="myFunction()">CLick</button>

</br>

<div id="myDiv2"></div>
<div id="myDiv3"></div>


<script>
function myFunction() {

    Array.prototype.randsplice = function () {

        var ri = Math.floor(Math.random() * this.length);
        var rs = this.splice(ri, 1);
        return rs;
    };

    var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    var result = my_array.randsplice();

    document.getElementById('myDiv').innerHTML=result;
    document.getElementById('myDiv1').innerHTML=my_array;

    }


</script>
</body>

好的，多亏了Travis J和他工作中的一些附加组件，更新了代码。所以我想从技术上来说，这条线已经结束了

但是。。。有没有更好的方法来执行以下操作

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton1" type="button">Click</button>

<br>
<div id="myDiv1"></div>
<div id="myDiv2"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton2" type="button">Click</button>

<br>
<div id="myDiv3"></div>
<div id="myDiv4"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton3" type="button">Click</button>

<br>
<div id="myDiv5"></div>
<div id="myDiv6"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton4" type="button">Click</button>

<br>
<div id="myDiv7"></div>
<div id="myDiv8"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton5" type="button">Click</button>

<br>
<div id="myDiv9"></div>
<div id="myDiv10"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton6" type="button">Click</button>

<br>
<div id="myDiv11"></div>
<div id="myDiv12"></div>

<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton7" type="button">Click</button>

<br>
<div id="myDiv13"></div>
<div id="myDiv14"></div>



<script>
//Nothing wrong here, so lets just do it first
Array.prototype.randsplice = function () {
    var ri = Math.floor(Math.random() * this.length);
    return this.splice(ri, 1);//removed extra variable
};

//Use an eventlistener to wait for the DOM to load
//so that we can depend on DOM elements being available
window.addEventListener("load",function(){

    //locate the button element and save it in a variable
    var button1 = document.getElementById("myButton1");
    var button2 = document.getElementById("myButton2");
    var button3 = document.getElementById("myButton3");
    var button4 = document.getElementById("myButton4");
    var button5 = document.getElementById("myButton5");
    var button6 = document.getElementById("myButton6");
    var button7 = document.getElementById("myButton7");

    //do the same for the divs
    var myDiv1 = document.getElementById("myDiv1");
    var myDiv2 = document.getElementById("myDiv2");

    //do the same for the divs
    var myDiv3 = document.getElementById("myDiv3");
    var myDiv4 = document.getElementById("myDiv4");

    //do the same for the divs
    var myDiv5 = document.getElementById("myDiv5");
    var myDiv6 = document.getElementById("myDiv6");

    //do the same for the divs
    var myDiv7 = document.getElementById("myDiv7");
    var myDiv8 = document.getElementById("myDiv8");

    //do the same for the divs
    var myDiv9 = document.getElementById("myDiv9");
    var myDiv10 = document.getElementById("myDiv10");

    //do the same for the divs
    var myDiv11 = document.getElementById("myDiv11");
    var myDiv12 = document.getElementById("myDiv12");

    //do the same for the divs
    var myDiv13 = document.getElementById("myDiv13");
    var myDiv14 = document.getElementById("myDiv14");


    //setup the array we will use for this example
    var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

    //show the original array values
    myDiv2.innerHTML = my_array;

        //attach a click event handler to our button
        button1.onclick = function() {
            //modify my_array and display result
            myDiv1.innerHTML = my_array.randsplice();
            myDiv2.innerHTML = my_array;

            //attach a click event handler to our button
            button2.onclick = function () {
                //modify my_array and display result
                myDiv3.innerHTML = my_array.randsplice();
                myDiv4.innerHTML = my_array;

                //attach a click event handler to our button
                button3.onclick = function () {
                    //modify my_array and display result
                    myDiv5.innerHTML = my_array.randsplice();
                    myDiv6.innerHTML = my_array;

                    //attach a click event handler to our button
                    button4.onclick = function () {
                        //modify my_array and display result
                        myDiv7.innerHTML = my_array.randsplice();
                        myDiv8.innerHTML = my_array;

                        //attach a click event handler to our button
                        button5.onclick = function () {
                            //modify my_array and display result
                            myDiv9.innerHTML = my_array.randsplice();
                            myDiv10.innerHTML = my_array;

                            //attach a click event handler to our button
                            button6.onclick = function () {
                                //modify my_array and display result
                                myDiv11.innerHTML = my_array.randsplice();
                                myDiv12.innerHTML = my_array;

                                //attach a click event handler to our button
                                button7.onclick = function () {
                                    //modify my_array and display result
                                    myDiv13.innerHTML = my_array.randsplice();
                                    myDiv14.innerHTML = my_array;

                                //check if the array is empty and if so, perhaps display a                  message
                              //  if (my_array.length == 0) alert("Empty!");
                            };
                        }}}}}}});
</script>
</body>
</html>

您应该在myFunction函数的上下文之外定义数组，否则您将在每个函数调用中定义一个新数组

var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

function myFunction() {
    if (my_array.length === 0) return;
    // ...

您应该在myFunction函数的上下文之外定义数组，否则您将在每个函数调用中定义一个新数组

var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

function myFunction() {
    if (my_array.length === 0) return;
    // ...

让我们看看这是否是您想要的：

function myFunction() {

    Array.prototype.randsplice = function () {

        var ri = Math.floor(Math.random() * this.length);
        var rs = this.splice(ri, 1);
        return rs;
    };

    var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    var result;

    while(my_array.length > 0) {
        result = my_array.randsplice();
        document.getElementById('myDiv').innerHTML+=result;
    }

}

让我们看看这是否是您想要的：

function myFunction() {

    Array.prototype.randsplice = function () {

        var ri = Math.floor(Math.random() * this.length);
        var rs = this.splice(ri, 1);
        return rs;
    };

    var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    var result;

    while(my_array.length > 0) {
        result = my_array.randsplice();
        document.getElementById('myDiv').innerHTML+=result;
    }

}

嗯，这里我建议进行一些重构。此外，您的确切演示不起作用的原因是每次调用函数时它都会重置my_数组的值，因此需要重新处理

//这里没什么问题，让我们先做吧 Array.prototype.randplice=函数{ var ri=Math.floorMath.random*this.length；返回this.striceri，1；//删除的额外变量 }; //使用eventlistener等待DOM加载 //因此，我们可以依赖可用的DOM元素 window.addEventListenerload，函数{ //找到按钮元素并将其保存在变量中 var button=document.getElementByIdmyButton； //对div也一样 var myDiv=document.getElementByIdmyDiv； var myDiv1=document.getElementByIdmyDiv1； //设置我们将用于此示例的阵列 var my_数组=['a'，'b'，'c'，'d'，'e'，'f'，'g']； //显示原始数组值 myDiv1.innerHTML=我的数组； //将单击事件处理程序附加到按钮 button.onclick=函数{ //修改我的_数组并显示结果 myDiv.innerHTML=my_array.randplice； myDiv1.innerHTML=我的数组； //检查数组是否为空，如果为空，可能会显示一条消息如果my_array.length==0 alertEmpty！； }; }; 点击嗯，这里我建议进行一些重构。此外，您的确切演示不起作用的原因是每次调用函数时它都会重置my_数组的值，因此需要重新处理

为了破解你想要的象形文字，我可以问一下：你是想洗牌我的_数组，你是想随机改变数组中的元素，比如a，b，c变成c，a，b？你想要一个array.empty方法，还是想知道如何反复调用randsplice直到数组为空，您可以使用while循环：whilemy_array.length>0{result=my_array.randplice；}我想重复随机调用randplice，直到数组为空。@ADASein yes，hieraglyph！我的问题是非常清楚我想做什么，却几乎不知道如何最好地去做和询问。耸耸肩，摇摇头。。。。我的困境也是如此……为了破解你想要的象形文字，我可以问一下：你是在尝试洗牌我的_数组，你是在尝试随机改变数组中的元素，例如a，b，c变成c，a，b？你想要一个array.empty方法，还是想知道如何反复调用randsplice，直到数组为空，您可以使用while循环：whilemy_array.length>0{result=my_array.randplice；}我想重复随机调用randplice，直到数组为空。@ADASein yes，hieraglyph！我的问题是非常清楚我想做什么，却几乎不知道如何最好地去做和询问。耸耸肩，摇摇头。。。。我的困境也是如此……我正在试着做7个按钮。单击每个按钮时，一个字母为ra

ndomly selected，从数组中切片，并放入按钮的相应div。基本上，单击的第一个按钮有一个包含7个字母的数组，第二个按钮有一个包含6个字母的数组，依此类推。顺便说一句，谢谢你的帮助Travis J肯定已经关闭了功能。但我需要将它扩展到7个按钮和14个div。这就是我正在尝试的。只是回答你的评论。我试着做7个按钮。单击每个按钮时，将随机选择一个字母，从数组中切片，并将其放入按钮的相应div中。基本上，单击的第一个按钮有一个包含7个字母的数组，第二个按钮将有一个包含6个字母的数组，依此类推。顺便说一句，谢谢你的帮助Travis J肯定已经关闭了功能。但我需要将它扩展到7个按钮和14个div。这就是我正在尝试的。只是回答你的意见。特拉维斯，谢谢你！这绝对是我正在寻找的功能。只有我在尝试创建7个按钮和14个div，就像你的1个按钮和2个div一样。特拉维斯，谢谢你！这绝对是我正在寻找的功能。只有我在尝试创建7个按钮和14个div，它们和你的1个按钮和2个div一样。