javascript - 网页将在 Microsoft Edge 中加载外部 CSS 和 JS，但不会在 Chrome 中

问题描述

我的项目让我制作了一个简单的网页，其中包含 javascript 函数来加、减、乘、立方和除两个数字。我有一个外部 CSS 样式表 Lab7.css 和一个外部 javascript 文件 Lab7JS.js，当我使用 Microsoft Edge 时它们会加载并正常工作，但在我使用 Chrome 时将无法正常工作。我在家用电脑上使用 Wampserver64。

以下是项目 HTML 部分的代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> 

<html>
<head>
    <title>Lab7</title>
    <meta http-equiv="content-type"   content="text/html;charset=UTF8"/>
    <link rel="stylesheet" type="text/css" href="Lab7.css">
    <script type="text/javascript" src="Lab7JS.js"></script>
</head>
<body>
<fieldset>
<legend>
SIMPLE MATHEMATICS BOX:
</legend>
<form name="calcForm">
<br />

First Integer <input type="text" name="num1" size="15">
Second Integer <input type="text" name="num2" size="15">
ANSWER <input type="text" name="output" size="20" readonly>
<BR><BR> 
SELECT THE OPERATION TO PERFORM & CLICK ON THE APPROPRIATE BUTTON
<br />
<br>
<table width="95%">
<tr>
    <td  width="16%" align="right">
        <input type="button" value="Add" onClick="add()">
    <td  width="16%" align="right">
        <input type="button" value="Sub" onClick="sub()">
    <td  width="16%" align="right">
        <input type="button" value="Multiply" onClick="multiply()">
    <td  width="16%" align="right">
        <input type="button" value="Cube" onClick="cube()">
    <td  width="16%" align="right">
        <input type="button" value="Divide" onClick="divide()">
    <td align="right">
        <input type="reset" value="Reset" alt="reset">
    </td>
</tr>
</table>
</form>
</fieldset>
</body>
</html>

这是css样式表的代码：

form 
{
    background:#90EE90; 
    border: #0000CC double 4px; 
    width: 80%;
}
h2 
{
    color: #CC00FF; 
    font-family: sans-serif;
}
legend 
{ 
    color:blue; 
    font-size:+6;
}

这是 Javascript 文件的代码：

function add()
{
    // Get values from form
    var num1, num2;
    num1 = parseInt(document.calcForm.num1.value);
    num2 = parseInt(document.calcForm.num2.value);

    // Compute the sum.
    var sum = num1+num2;

    // Display sum in form.
    document.calcForm.output.value = sum;
}

function sub()
{
    // Get values from form
    var num1, num2;
    num1 = parseInt(document.calcForm.num1.value);
    num2 = parseInt(document.calcForm.num2.value);

    // Compute the difference.
    var sum = num1-num2;

    // Display sum in form.
    document.calcForm.output.value = sum;
} 

function divide()
{
    // Get values from form
    var num1, num2;
    num1 = parseInt(document.calcForm.num1.value);
    num2 = parseInt(document.calcForm.num2.value);

    // Compute the quotient.
    var sum = num1/num2;

    // Display sum in form.
    document.calcForm.output.value = sum;
}
function multiply()
{
    // Get values from form
    var num1, num2;
    num1 = parseInt(document.calcForm.num1.value);
    num2 = parseInt(document.calcForm.num2.value);

    // Compute the product.
    var product = num1*num2;

    // Display product in form.
    document.calcForm.output.value = product;
}
function cube()
{
    // Get values from form
    var num1;
    num1 = parseInt(document.calcForm.num1.value);

    // Compute the product.
    var product = num1*num1*num1;

    // Display product in form.
    document.calcForm.output.value = product;
}

标签： javascriptcss

javascript - 网页将在 Microsoft Edge 中加载外部 CSS 和 JS，但不会在 Chrome 中

问题描述

解决方案

推荐阅读