नहीं पढ़ता है, मैं कोडिंग और स्टॉक ओवरफ्लो में काफी शुरुआत कर रहा हूं। यह मेरी पहली पोस्ट है इसलिए कृपया क्षमा करें यदि मेरी पोस्ट सही ढंग से स्वरूपित नहीं है क्योंकि मैं केवल हाई स्कूल में जूनियर हूं। उस नोट पर हालांकि, मेरे पास नीचे दिए गए कोड के बारे में एक प्रश्न था। बस थोड़ी सी पृष्ठभूमि, यह कोड भाग्य की एक सूची उत्पन्न करना और प्रत्येक भाग्य को जोड़ना है, फिर एक बार यह पूरी सूची के माध्यम से चला गया है, यह एक यादृच्छिक क्रम में एक नया पुनर्जन्म देता है। (नीचे दिए गए कोड का संदर्भ लें) समस्या anotherFortune()
के दौरान होती है। जब यह फ़ंक्शन generateFortuneCookie()
को दोबारा शुरू करता है, तो दूसरी बार यह भाग्य सूची सरणी से किसी भी मूल्य को खींचने के लिए प्रतीत नहीं होता है। यह console.logs के रूप में, "आप करेंगे।" साथ ही, यह तीसरी सूची को पुन: उत्पन्न नहीं करता है, Google क्रोम नीचे त्रुटि देता है।फिर फ़ंक्शन चलाते समय यह वैश्विक सरणी
app.js:33 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node
जब बटन लगभग 10 बार क्लिक किया जाता है। कृपया ध्यान दें कि मैंने अभी तक jQuery नहीं सीखा है, इसलिए कोई समाधान मैं जावास्क्रिप्ट समाधान पसंद करूंगा।
नीचेजावा स्क्रिप्ट कोड:
var fortunesList = ["die 2mrrw", "find a dollar", "become poor", "jump off a cliff", "turn into Batman"];
//if any fortunes are added to the list above, make sure to change "for loop" paramter one value (var i = " ";) and stats function at bottom
function generateFortuneCookie(){ //runs for the first time button is pressed
var cloneList = fortunesList.slice();
//randomizer for fortunes
var randomFortune = " ";
for (var i = 4; i >= 0; i--){
randomFortune = cloneList.splice(Math.floor(Math.random() * (i + 1)), 1); //(i + 1) ensures 5 values are returned since the last value in math.random is excluded
console.log("You will " + randomFortune + ".");
//temporarily stores random list
var tempCache = document.getElementById("fortune-cache");
var nodeone = document.createElement("DIV");
nodeone.innerText = "You will " + randomFortune + ".";
tempCache.appendChild(nodeone);
}
//changes button to prevent a new list of variables from being created
document.getElementById("first").style.display = "none";
document.getElementById("second").style.display = "block";
//appends last fortune from "fortune-cache" into "fortune-cookie-text"
var cookieText = document.getElementById("fortune-cookie-text");
var nodetwo = tempCache.lastChild;
cookieText.appendChild(nodetwo);
}
var count = 0;
var max = fortunesList.length;
//variables above pertain to the "count" function that reruns the "generateFortuneCookie()" function
var heightCount = 0;
//must be seperate and increase OUTSIDE of function, determines div height (dynamicDiv)
function anotherFortune(){ //this should run only after the first fortune is produce
var cookieText = document.getElementById("fortune-cookie-text"); //this variable MUST go before nodethree otherwise if declared after, nodethree won't recognize variable
//appends text from "fortune-cookie-text" to "previous-fortunes", this must be run first before adding new text from tempCache
var nodethree = document.createElement("LI");
nodethree.appendChild(cookieText.lastChild);
document.getElementById("previous-fortunes").appendChild(nodethree);
//button counter
count++
//console.log(count);
if(count == max){ //once it runs out of fortunes, it will regenerate a new list
generateFortuneCookie();
count = 0; //resets count back to zero
}
//this increases div height as list increases
var dynamicDiv = document.getElementById("other-fortunes-div");
var height = dynamicDiv.clientHeight;
heightCount++
//console.log(heightCount);
if(heightCount >= 2){
dynamicDiv.style.height = height + 1 + "px";
}
//appends text from "fortune-cache" into "fortune-cookie-text", runs after appending text into "previous-fortunes"
var tempCache = document.getElementById("fortune-cache");
var nodetwo = tempCache.lastChild;
cookieText.appendChild(nodetwo);
}
एचटीएमएल नीचे कोड:
<!DOCTYPE html>
<html>
<head>
<title>Fortune Cookie Gen</title>
<script type="text/javascript" src="./JS/app.js"></script>
<link rel="stylesheet" type="text/css" href="./CSS/styles.css">
<meta charset="utf-8">
</head>
<body>
<button onclick="generateFortuneCookie()" id="first">Make My Fortune!</button>
<button onclick="anotherFortune(); stats();" id="second">Generate Another Fortune!</button>
<div id="fortune-cache">
</div>
<div id="fortune-cookie-text">
<h3>Your Fortune</h3>
</div>
<div id="other-fortunes-div">
<h3>Previous Fortunes</h3>
<ul id="previous-fortunes">
</ul>
</div>
<div id="statistics">
<h3>Fortune Statistics</h3>
<div id="one">
</div>
<div id="two">
</div>
<div id="three">
</div>
<div id="four">
</div>
<div id="five">
</div>
</div>
</body>
</html>
बस का उपयोग '' बजाय splice' की slice'। –
एक तरफ ध्यान दें, "मैं स्टॉकओवरफ्लो में नया हूं" और प्रीफ़ासिंग द्वारा साइट के नाम की गलत वर्तनी बहुत बढ़िया है। –