Question

我正在尝试编写代码编辑器，并且我一直在运行一个假定未定义的函数。

从HTML文件：

<button type="button" id="launchButton" onclick="launch();">Launch</button>

来自JS：

function launch() {
"use strict";

var CSSText = document.getElementById('CSS').value;
var HTMLText = document.getElementById('HTML').value;

var head = "<head><style>" + CSSText + "</style></head>";

var iframe = document.getElementById('previewPane');

iframe = (iframe.contentWindow) ? iframe.contentWindow : (iframe.contentDocument.document) ? iframe.contentDocument.document : iframe.contentDocument;
iframe.document.open();
iframe.document.write(head + HTMLText);
iframe.document.close();
return false;
}
launch();

我试图执行的另外两个功能也是如此：

HTML：

<textarea id="CSS" name="CSS" placeholder="Type your CSS here!" rows="10" cols="40" ondblclick="replaceText1();"></textarea>

JS：

function replaceText1() {
"use strict";

var textAreaObject = document.getElementById('CSS');
textAreaObject.value = "h3 {color: blue; } p { font-family: cursive, arial; font-size: 25pt;}"
}
replaceText1();

HTML：

<textarea id="HTML" name="HTML" placeholder="Type your HTML here!" rows="10" cols="40" ondblclick="replaceText2();"></textarea>

JS：

function replaceText2() {
"use strict";

var textAreaObject = document.getElementById('HTML');
textAreaObject.value = "<h3> Hello! </h3> <p> applied? </p>"
}
replaceText2();

无论我尝试过什么，我都会在我用HTML调用函数的行中获取Uncaught ReferenceError。我没有从语法中得到什么？

修改

这是我的HTML文档：

<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title id="titleTag">code editor</title>
    <script href="JS.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="CSS.css"/>
    </head>
<body>

    <h1>Code Editor</h1>

    <div id="center">

        <div class="grid">

            <form action="#" method="post">

                <textarea id="CSS" name="CSS" placeholder="Type your CSS here!" rows="10" cols="40" ondblclick="replaceText1();"></textarea> 

                <br/>

                <textarea id="HTML" name="HTML" placeholder="Type your HTML here!" rows="10" cols="40" ondblclick="replaceText2();"></textarea>

                <br/>

                <button type="button" id="launchButton" onclick="launch();">Launch</button>
                <button type="button" id="clearButton" onclick="clear();">Clear</button>
                <button type="button" id="toggleButton" onclick="toggle();">Toggle</button>

            </form>

        </div>

        <div class="grid">

            <iframe id="previewPane"></iframe>

        </div>
    </div>

    <h2>Zeo</h2>

</body>

随附的JS文件：

function launch(CSS, HTML, previewPane) {
"use strict";

var CSSText = document.getElementById('CSS').value;
var HTMLText = document.getElementById('HTML').value;

var head = "<head><style>" + CSSText + "</style></head>";

var iframe = document.getElementById('previewPane');

iframe = (iframe.contentWindow) ? iframe.contentWindow : (iframe.contentDocument.document) ? iframe.contentDocument.document : iframe.contentDocument;
iframe.document.open();
iframe.document.write(head + HTMLText);
iframe.document.close();
return false;
}
launch();

function replaceText1() {
"use strict";

var textAreaObject = document.getElementById('CSS');
textAreaObject.value = "h3 {color: blue; } p { font-family: cursive, arial; font-size: 25pt;}"
}
replaceText1();

function replaceText2() {
"use strict";

var textAreaObject = document.getElementById('HTML');
textAreaObject.value = "<h3> Hello! </h3> <p> applied? </p>"
}
replaceText2();

我一直在为onclick定义的函数获取控制台错误

0 个答案: