替换Document.write问题(我做了一些研究，但还是失败了）
Replacing Document.write Problems(I did some research but still failed)
我得到了一个很好的答案，但还有更多的问题。：）有人告诉我，在两个不同的地方声明javascript既糟糕又混乱（你可以在下面的答案中看到），但我现在正在从一本书中学习，它告诉我把我的变量、数组、函数等放在html的头部，其余的放在正文中。（这就是为什么我在两个不同的地方声明了javascript）这是错误的吗？为什么？他还建议使用开发工具。一般来说，我对编码很陌生，对这些不太了解。有人能推荐一个chrome的开发工具吗？开发人员工具还能做什么？谢谢
已修复：
嗨，我正在转换纸牌战争游戏，所以它在页面上而不是在控制台上工作，这是我的原始代码http://pastebin.com/AgLgy97F.我试着用document.write在网上写代码，但我发现document.write重写了整个页面，并删除了我放在那里的按钮，以进入下一轮。
我在论坛上和网上看了看，得出的结论是我应该用这个<div id="play"></div>和document.getElementById("play").innerHTML="I'm a string!"来替换它。所以我做了这个http://pastebin.com/29mVqp67.我试了一下，什么也没发生。替换document.write时我做错了什么？
我制作的新代码也在这里：
<html>
<head>
<script language="JavaScript">
<!--
var disp = function() {
document.getElementByID("play").innerHTML="You drew a "+user_disp+".";
document.getElementByID("play").innerHTML="Your opponent drew a "+cpu_disp+".";
document.getElementByID("play").innerHTML=statement;
};
var war = function() {
document.getElementByID("play").innerHTML="W-A-R spells WAR!";
disp();
};
var full = [1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5,6,6,6,6,7,7,7,7,8,8,8,8,9,9,9,9,10,10,10,10,11,11,11,11,12,12,12,12,13,13,13,13];
var user = [];
var cpu = [];
var rand = 0;
//Shuffles and deals the deck
var shuffled = [];
for (var i=0;i<52;i++) {
rand=Math.floor(Math.random()*full.length);
shuffled.push(full[rand]);
full.splice(rand,1);
}
for (var j=0;j<52;j++) {
if (j%2===0) {
user[user.length]=shuffled.pop();
} else {
cpu[cpu.length]=shuffled.pop();
}
}
//Creates a bunch of variables and functions that will be needed in the game
var cpu_card=0;
var cpu_warcard=0;
var cpu_war1=0;
var cpu_war2=0;
var cpu_war3=0;
var cpu_disp=0;
var user_card=0;
var user_warcard=0;
var user_war1=0;
var user_war2=0;
var user_war3=0;
var user_disp=0;
var statement=0;
var card_name = function(cpuc,userc) {
switch (cpuc) {
case 13:
cpu_disp="K";
break;
case 12:
cpu_disp="Q";
break;
case 11:
cpu_disp="J";
break;
case 1:
cpu_disp="A";
break;
default:
cpu_disp=cpuc;
break;
}
switch (userc) {
case 13:
user_disp="K";
break;
case 12:
user_disp="Q";
break;
case 11:
user_disp="J";
break;
case 1:
user_disp="A";
break;
default:
user_disp=userc;
break;
}
};
//Lets play the game!
//-->
</script>
</head>
<body>
<form>
<input type="Button" value="Click to Take Your Turn" onClick="playWar()"></input>
</form>
<p>
<h1>This Is War Lets Play!!!!</h1>
<br>
<div id="play"></div>
<script language="JavaScript">
<!--
function playWar(){
if(user.length<52 && user.length>1) {
//Picks out the cards that are used
cpu_card=cpu.shift();
user_card=user.shift();
card_name(cpu_card,user_card);
//Figures out if you win, lose, or go to war
if (user_card<cpu_card) {
statement="You lost!";
cpu[cpu.length]=cpu_card;
cpu[cpu.length]=user_card;
} else {
if (user_card>cpu_card) {
statement="You won!";
user[user.length]=user_card;
user[user.length]=cpu_card;
} else {
if(cpu.length<3 || user.length<3){
user[user.length]=user_card;
cpu[cpu.length]=cpu_card;
}
else{
statement="You tied! TO WAR!";
}
}
}
disp();
//This is what happens when you go to war
if (statement==="You tied! TO WAR!") {
cpu_war1=cpu.shift();
cpu_war2=cpu.shift();
cpu_war3=cpu.shift();
cpu_warcard=cpu.shift();
user_war1=user.shift();
user_war2=user.shift();
user_war3=user.shift();
user_warcard=user.shift();
card_name(cpu_warcard,user_warcard);
if (user_warcard<cpu_warcard) {
statement="You lost the war to your opponent!";
cpu[cpu.length]=cpu_war1;
cpu[cpu.length]=cpu_war2;
cpu[cpu.length]=cpu_war3;
cpu[cpu.length]=cpu_warcard;
cpu[cpu.length]=cpu_card;
cpu[cpu.length]=user_war1;
cpu[cpu.length]=user_war2;
cpu[cpu.length]=user_war3;
cpu[cpu.length]=user_warcard;
cpu[cpu.length]=cpu_card;
} else {
if(user_warcard>cpu_warcard) {
statement="You crushed your opponent in war!";
user[user.length]=user_war1;
user[user.length]=user_war2;
user[user.length]=user_war3;
user[user.length]=user_warcard;
user[user.length]=user_card;
user[user.length]=cpu_war1;
user[user.length]=cpu_war2;
user[user.length]=cpu_war3;
user[user.length]=cpu_warcard;
user[user.length]=cpu_card;
} else {
statement="The war resulted in a stalemate!";
user[user.length]=user_war1;
user[user.length]=user_war2;
user[user.length]=user_war3;
user[user.length]=user_warcard;
user[user.length]=user_card;
cpu[cpu.length]=cpu_war1;
cpu[cpu.length]=cpu_war2;
cpu[cpu.length]=cpu_war3;
cpu[cpu.length]=cpu_warcard;
cpu[cpu.length]=cpu_card;
}
}
war();
}
}
//When you are done, here it finds if you win or lose this game
else if (user.length===52) {
document.getElementByID("play").innerHTML="You have crushed your opponent. Feel free to steal all of his belongings!";
} else {
document.getElementByID("play").innerHTML="Unfortunatly, you have fallen victim to your opponent's wrath and have been conquered.;
}
}
//-->
</script>
</body>
您首先要解决一些问题。
-
您在两个不同的地方声明了javascript，在这两种情况下都会污染全局命名空间。这应该清理，可能有助于识别一些问题。
-
在这一行的末尾有一个未终止的字符串文字：
you have fallen victim to your opponent's wrath and have been conquered. <=== -
getElementByID需要成为getElementByID
-
您的disp（）函数不正确。在书写过程中，每一行都在替换前面的文本。
var disp=函数（）{document.getElementByID（"play"）.innerHTML="您绘制了一个"+user_disp+"。"；document.getElementByID（"play"）.innerHTML="你的对手画了一个"+cpu_disp+"。"；document.getElementByID（"play"）.innerHTML=语句；}；
这可以通过在设置innerHtml之前将字符串连接在一起来解决，或者，为了更好地控制输出，可以使用单独的元素。伪代码：
else.innerHTML = string1 + string2 + string3;
我建议无论您使用哪种浏览器进行开发，都要大量使用开发工具。它将通过观察控制台输出或逐步执行代码来帮助您发现其中的许多问题。
我也把你的代码放在了jsFiddle中。
这应该会让你开始。祝你好运
相关文章：
- PHP和JS脚本的奇怪问题，在我刷新页面之前第一次失败
- JavascriptMVC失败的食谱出现了问题
- 处理从 CDN 加载资源失败或缓慢的问题
- 角度过滤器问题，特殊字符失败
- 节点中的 CORS 问题.js失败
- CORS 预检请求的奇怪问题在 IE 11 上失败
- 节点.js脚本由于代理问题而失败
- nodejs 请求 - toString 失败 - 大文件的缓冲区大小问题 (maxBufferSize）
- MongoError: 身份验证失败.- 连接到MongoLab时出现问题
- 命令失败: gm 识别: 无法打开文件 (2） [没有这样的文件或目录].通用模块和 ES6 承诺的问题
- Javascript (jQuery） 事件失败.我该如何解决这个问题
- 尽管Access Control Allow Origin标头存在问题，但跨域XHR失败
- 如何修复添加转盘时引导程序下拉失败的问题
- 通过Getscript检索的脚本静默失败-如何解决此问题
- 替换Document.write问题(我做了一些研究，但还是失败了）
- 奇怪的字符编码问题导致js函数失败或添加不需要的字符
- Jquery临时回调问题- $.提示失败
- 笑话问题:调试失败的测试和使用——bail
- Chrome浏览器问题:“加载资源:net::ERR_CONNECTION_TIMED_OUT”失败
- 由于交叉问题，nodejs加载URL失败
