随机空JavaScript数组 [英] Randomly Empty a Javascript Array
本文介绍了随机空JavaScript数组的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图清空了一系列按钮的onclick事件的数组。
我如何访问新拼接数组
从上面压过同样的功能，直到没有更多的字母??
这是code我使用的：
（PS，我AP preciate社区，注释，说明和帮助，但如果你是要告诉我怎么不当code是请想重写它使每个人都可以学习的正确方法）
＆LT;身体GT;＆LT;按钮的onClick =myFunction的（）＆gt;点击＆LT; /按钮＆GT;＆LT; / BR＆GT;
＆LT; DIV ID =myDiv＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =为myDiv1＆GT;＆LT; / DIV＆GT;＆LT;按钮的onClick =myFunction的（）＆gt;点击＆LT; /按钮＆GT;＆LT; / BR＆GT;＆LT; DIV ID =myDiv2＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =为mydiv3＆GT;＆LT; / DIV＆GT;
＆LT;脚本＆GT;
功能myFunction的（）{ Array.prototype.randsplice =功能（）{ 变种RI = Math.floor（的Math.random（）* this.length）;
VAR RS = this.splice（RI，1）;
返回RS;
}; VAR my_array = ['一'，'B'，'C'，'D'，'E'，'F'，'G'];
VAR的结果= my_array.randsplice（）; 的document.getElementById（'myDiv'）的innerHTML =结果。
的document.getElementById（'为myDiv1'）的innerHTML = my_array。 }
＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
好吧，更新code感谢特拉维斯J和一些附件添加到他的工作。
所以我想在技术上这个线程已经结束了。
但是...有没有更好的方式来做到以下几点？
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML和GT;
＆LT;头LANG =ENGT＆;
＆LT;间的charset =UTF-8＆GT;
＆LT;标题＆GT;＆LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton1类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =为myDiv1＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv2＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton2类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =为mydiv3＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv4＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton3类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =myDiv5＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv6＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton4类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =myDiv7＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv8＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton5类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =myDiv9＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv10＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton6类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =myDiv11＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv12＆GT;＆LT; / DIV＆GT;＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;
＆LT;按钮ID =myButton7类型=按钮＆gt;点击＆LT; /按钮＆GT;＆LT; BR＆GT;
＆LT; DIV ID =myDiv13＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =myDiv14＆GT;＆LT; / DIV＆GT;＆LT;脚本＆GT;
//没有错在这里，所以让我们只是做第一
Array.prototype.randsplice =功能（）{
变种RI = Math.floor（的Math.random（）* this.length）;
返回this.splice（RI，1）; //去掉额外的变量
};//使用的EventListener等待DOM来加载
//这样我们可以依靠的DOM元素是可用
window.addEventListener（加载功能（）{ //定位按钮元素，并将其保存在一个变量
VAR按钮1 =的document.getElementById（myButton1）;
VAR按钮2 =的document.getElementById（myButton2）;
VAR按钮3 =的document.getElementById（myButton3）;
变种将Button4 =的document.getElementById（myButton4）;
变种button5 =的document.getElementById（myButton5）;
变种button6 =的document.getElementById（myButton6）;
变种button7 =的document.getElementById（myButton7）; //做的div相同
变种为myDiv1 =的document.getElementById（为myDiv1）;
变种myDiv2 =的document.getElementById（myDiv2）; //做的div相同
变种为mydiv3 =的document.getElementById（为mydiv3）;
变种myDiv4 =的document.getElementById（myDiv4）; //做的div相同
变种myDiv5 =的document.getElementById（myDiv5）;
变种myDiv6 =的document.getElementById（myDiv6）; //做的div相同
变种myDiv7 =的document.getElementById（myDiv7）;
变种myDiv8 =的document.getElementById（myDiv8）; //做的div相同
变种myDiv9 =的document.getElementById（myDiv9）;
变种myDiv10 =的document.getElementById（myDiv10）; //做的div相同
变种myDiv11 =的document.getElementById（myDiv11）;
变种myDiv12 =的document.getElementById（myDiv12）; //做的div相同
变种myDiv13 =的document.getElementById（myDiv13）;
变种myDiv14 =的document.getElementById（myDiv14）;
//设置数组，我们将使用这个例子
VAR my_array = ['一'，'B'，'C'，'D'，'E'，'F'，'G']; //显示原始数组值
myDiv2.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button1.onclick =功能（）{
//修改my_array，并将结果显示
myDiv1.innerHTML = my_array.randsplice（）;
myDiv2.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button2.onclick =功能（）{
//修改my_array，并将结果显示
myDiv3.innerHTML = my_array.randsplice（）;
myDiv4.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button3.onclick =功能（）{
//修改my_array，并将结果显示
myDiv5.innerHTML = my_array.randsplice（）;
myDiv6.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button4.onclick =功能（）{
//修改my_array，并将结果显示
myDiv7.innerHTML = my_array.randsplice（）;
myDiv8.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button5.onclick =功能（）{
//修改my_array，并将结果显示
myDiv9.innerHTML = my_array.randsplice（）;
myDiv10.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button6.onclick =功能（）{
//修改my_array，并将结果显示
myDiv11.innerHTML = my_array.randsplice（）;
myDiv12.innerHTML = my_array; //附加一个单击事件处理程序，以我们的按钮
button7.onclick =功能（）{
//修改my_array，并将结果显示
myDiv13.innerHTML = my_array.randsplice（）;
myDiv14.innerHTML = my_array; //检查是否数组为空，如果是这样，也许显示消息
//如果（my_array.length == 0）警报（空的！）;
};
}}}}}}}）;
＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
解决方案
那么，有一些refactorizations我会建议在这里。此外，您的具体演示不起作用的原因是，它重置值 my_array 每次函数被调用，所以需要进行返工。
\r
\r\r
\r //没有错在这里，所以让刚刚做第一\r
Array.prototype.randsplice =功能（）{\r
变种RI = Math.floor（的Math.random（）* this.length）;\r
返回this.splice（RI，1）; //去掉额外的变量\r
};\r
\r
//使用的EventListener等待DOM来加载\r
//这样我们可以依靠的DOM元素是可用\r
window.addEventListener（加载功能（）{\r
\r
//定位按钮元素，并将其保存在一个变量\r
VAR键=的document.getElementById（myButton的）;\r
\r
//做的div相同\r
变种myDiv =的document.getElementById（myDiv）;\r
变种为myDiv1 =的document.getElementById（为myDiv1）;\r
\r
//设置数组，我们将使用这个例子\r
VAR my_array = ['一'，'B'，'C'，'D'，'E'，'F'，'G'];\r
\r
//显示原始数组值\r
myDiv1.innerHTML = my_array;\r
\r
//附加一个单击事件处理程序，以我们的按钮\r
button.onclick =功能（）{\r
//修改my_array，并将结果显示\r
myDiv.innerHTML = my_array.randsplice（）;\r
myDiv1.innerHTML = my_array;\r
\r
//检查是否数组为空，如果是这样，也许显示消息\r
如果（my_array.length == 0）警报（空的！）;\r
};\r
}）; \r
＆LT;！ - 型按钮，按钮使之不会隐收到提交它的类型 - ＆GT;\r
＆LT;按钮的id =myButton的类型=按钮＆gt;点击＆LT; /按钮＆GT;\r
\r
＆LT; BR＆GT;\r
＆LT; DIV ID =myDiv＆GT;＆LT; / DIV＆GT;\r
＆LT; DIV ID =为myDiv1＆GT;＆LT; / DIV＆GT; \r
I am trying to empty an array with a series of button onclick events.
How do I access the newly spliced array to run the same function over it until there are no more letters??
This is the code I am using:
(PS, I appreciate the community, comments, instructions, and help, but if you are gonna tell me how improper the code is, please think to rewrite it so everyone can learn the right way)
<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>
Ok, Updated code thanks to Travis J and some add ons to his work. So I suppose technically this thread is over.
But... is there a better way to do the following?
<!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>
解决方案
Well, there are some refactorizations I would suggest here. In addition, the reason your exact demo does not work is that it resets the values of my_array each time the function is called, so that needs to be reworked.
//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 button = document.getElementById("myButton");
//do the same for the divs
var myDiv = document.getElementById("myDiv");
var myDiv1 = document.getElementById("myDiv1");
//setup the array we will use for this example
var my_array = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
//show the original array values
myDiv1.innerHTML = my_array;
//attach a click event handler to our button
button.onclick = function(){
//modify my_array and display result
myDiv.innerHTML = my_array.randsplice();
myDiv1.innerHTML = my_array;
//check if the array is empty and if so, perhaps display a message
if(my_array.length == 0) alert("Empty!");
};
});
<!-- type button as button so that it does not implicitly recieve submit as its type -->
<button id="myButton" type="button">Click</button>
<br>
<div id="myDiv"></div>
<div id="myDiv1"></div>
这篇关于随机空JavaScript数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
