为什么我的函数在HTML文件中有效,但在JS文件中却无效?

时间:2018-03-19 20:26:27

标签: javascript html function dom

我正在创建一个包含文本区域的网页,用户可以输入代码并将其显示在下方。如果我将我的函数放在HTML文件中它工作得很好但是当我将它移动到JS文件时它不起作用。任何帮助,甚至指向我的问题的方向将不胜感激。 这是我的HTML代码,功能已注释掉......

<!DOCTYPE html>
<html>

<head>
<title>DOM TREE 2</title>
<link rel="stylesheet" href="css/Content.css">
<script type="text/javascript" src="JS/js01.js"></script> 
</head>

<body style="background-color:lightgray" id="bd">
<div id="third">
    <h1> DOM TREE <img src="Images/tree_logo.jpg" alt="Calc" id = "pic">
</h1>
    <form id="DOMForm">

    <textarea id="myTextarea" rows="4" cols="50"></textarea>

    <p><button type="button" onclick="AddFunction()">Add Content</button>
    <button type="button" onclick="Change()">Change Style</button>
    <button type="button" onclick="Clear()">Clear Content</button>
    </p>

    <p id="demo"></p>

<!--<script>
function AddFunction() {
    var x = document.getElementById("myTextarea").value;
    document.getElementById("demo").innerHTML = x;
}
</script> -->

</body>
</html>

这是带有函数的JS文件.....

function AddFunction() 
{
    var x = document.getElementById("myTextarea").value;
    document.getElementById("demo").innerHTML = x;
}
function changestyle() 
{

}

function clear() 
{
    document.getElementById("DomForm").reset(); 
}

1 个答案:

答案 0 :(得分:1)

由于名称不同,请将onclick="Change()"function changestyle()onclick="Clear()"function clear()进行比较。