Javascript 将我的.js文件与.html文件链接

Javascript 将我的.js文件与.html文件链接,javascript,jquery,html,Javascript,Jquery,Html,我不知道我的编码有什么问题,我的.js文件似乎无法在html文件中激活。请帮帮我 可以忽略其余部分,我只想在html中激活我的Javascript文件 var num1 = 0; var num2 = 0; var sum = 0; function randomNumber(){ num1 = Math.floor((Math.random() * 10) + 1); num2 = Math.floor((Math.random() * 10) + 1); $("#number1").tex

我不知道我的编码有什么问题,我的.js文件似乎无法在html文件中激活。请帮帮我

可以忽略其余部分,我只想在html中激活我的Javascript文件

var num1 = 0;
var num2 = 0;
var sum = 0;

function randomNumber(){
num1 = Math.floor((Math.random() * 10) + 1);
num2 = Math.floor((Math.random() * 10) + 1);
$("#number1").text(num1);
$("#number2").text(num2);
sum =  parseInt(num1) + parseInt(num2);
}

randomNumber();

   $(":button").click(function () {
    var text = $(":text").val();
    if(text == sum)
    {
      alert("Correct");
      randomNumber();
      $(":text").val("");

    }
    else
    {
        alert("Wrong");
        randomNumber();
        $(":text").val("");
    }

});
它无法链接到我的html文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab Report</title>
<script src="jquery.js"></script>
<script src="myscript1.js"></script>

<style>
body{font-size:40px;
text-align:center;
background-color: #FC6;}
table {margin-top:200px;
background-color:white;}
td { width:150px;}
input {font-size:20px;}
span {font-size:40px;}
#correctScore{
    background-color:green;


}
#wrongScore{
    background-color:red;

}
</style>
</head>

<body>


<table width="800" border="1" align="center">
     <tr>

    <td colspan="6" align="right" id="timer"><span>Timer : 50 <span></td>


  </tr>

<tr>

    <td colspan="6" id="question"><span>Question 1/10<span></td>


  </tr>


    <tr>
    <td><span>Correct<span></td>
    <td  id="correctScore"><span>0<span></td>
    <td><span>Wrong<span></td>
    <td id="wrongScore"><span >0<span></td>
    <td></td>
    <td></td>

  </tr>
  <tr>
    <td><div id="number1">1</div></td>
    <td><div>+</div></td>
    <td><div id="number2">2</div></td>
    <td><div>=</div></td>
    <td><input type="text"></input></td>
    <td><input type="button" value="Check"></input></td>

  </tr>
</table>

</body>
</html>

实验室报告
正文{字体大小:40px;
文本对齐:居中;
背景色:#FC6;}
表{页边页首:200px;
背景色:白色;}
td{宽度:150px;}
输入{字体大小:20px;}
span{font size:40px;}
#修正分数{
背景颜色:绿色;
}
#错误分数{
背景色:红色;
}
计时器:50
问题1/10
对的
0
错
0
1.
+
2.
=

我怀疑您得到了404,而您的脚本根本没有加载,或者您的脚本引发了异常。您需要做的第一件事是确保您的所有资源都已使用您使用的任何浏览器的开发工具成功下载

您需要做的下一件事是将代码放入jqueryready函数中,因为您正在使用jquery

$(function() { 
    //code goes here
});

如果仍不工作,请访问浏览器开发工具中的控制台,查看错误所在。

几乎没有故障。

  • 正如iamkrillin指出的,如果您想修改DOM元素,那么应该在DOM初始化之后运行脚本

  • $(“:text”).val()的返回值是字符串。即使JavaScript不是强类型转换的,也可以安全地将字符串转换为int
    var text=parseInt($(“:text”).val()当您要执行数字操作时

  • 一些建议

    而不是
    alert()
    您可以使用
    console.log()并在浏览器控制台中检查输出。有关console.log的更多信息,请参阅

    您应该显示一个目录树示例以提供详细信息

    例如,使用
    时,应确保
    jquery.js
    文件与
    文件.html
    位于同一目录中

    像这样:

    yourApp
    .      jquery.js
    .      myscript.js
    .      index.html
    
    但在任何情况下,都要进行测试:

  • file.html
  • 转到
    网络
    选项卡
  • 按F5(重新加载)
  • 验证
    jquery.js
    myscript.js
    是否已成功下载

  • 杰伊,做
    iamkrillin
    上面建议的测试(+1)。也要这样做-将js代码简化为上面显示的document.ready代码,并在其中显示
    //代码在这里
    ——只需做一个警报测试:
    警报(“它起作用”)如果该测试有效,那么慢慢地将代码一点一点地添加回去,直到找到问题。