0

我今天刚在学校学习 Javascript 基础知识，但遇到了一个问题。

练习是制作一个带有文本框（我必须在其中放置一个数字 x）和一个按钮的 html 页面，当我单击该按钮时，该页面应使用 'document.write 形成一个从 1 到 x 的星号三角形' 功能。

我可以这样做，但问题是我需要能够重复使用此功能，例如如果我更改文本框中的数字并再次单击按钮，应该创建一个新三角形，并且之前的内容必须是也保存了。

我必须只使用 document.write 来实现这一点，但是使用 document.write 会删除所有以前的内容，因此在新创建的页面中，'head' 中的脚本不存在。



这是我的代码。

4

2 回答 2

1

获取 body 元素的 HTML 并将新模式附加到此 HTML 并将其写入文档。

var bodyHtml = document.body.innerHTML;
var newHtml = "";
//create new pattern and save in newHtml variable

Document.write(bodyHtml + < br /> + newHtml);
于 2013-10-28T18:06:08.067 回答
1

document.write（MDN 文档），当从文档头部中的脚本标签之类的上下文中调用时，将预先调用document.open（MDN 文档），这将重新初始化文档，覆盖之前的任何内容。但是，如果您没有调用或明确调用，后续调用document.write 不会覆盖以前编写的内容。document.opendocument.close

您可以将之前写入文档的内容保存在变量中，并且可以document.open事先调用。类似于以下内容：

    var ShowOnPage = '<input type="text" id="text1" />' + '<input type="button" value="Click Me" onClick="CreateTriangle()" /> <br/>';
    function CreateTriangle() {
        var x = parseInt(document.getElementById("text1").value);
        for (i = 1; i <= x; i++) {
            for (j = 1; j <= i; j++) {
                ShowOnPage += "*";
            }
            ShowOnPage += "<br/>"
        }
        document.open();
        document.write(ShowOnPage);
        document.close();
    }

请注意，ShowOnPage它在函数外部创建以创建三角形，并使用您希望在单击之间保留的输入值进行初始化。还要注意调用的使用和document.open调用。document.closedocument.write

作为旁注，为什么document.write这里需要？这不是你要实现这样的东西的方式，并且教授document.write在实际情况中几乎从未使用过的东西的使用对于增加 Web 开发的知识没有任何帮助。

您可以通过引入innerHTML和getElementById调整某个元素的内容来获得相同的概念，就像在这个小提琴中一样。

于 2013-10-28T18:09:15.683 回答