Question

我刚进入学校的Javascript基础知识，而且我遇到了一个问题。

练习是制作一个带有文本框的html页面（我必须放一个数字x）和一个按钮，当我点击按钮时，页面应该形成一个带有星号的三角形，从1到x使用＆＃39;文件撰写＆＃39;功能。

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

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

有人可以建议我吗？

Here's my code.

Answer 1

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

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

Document.write(bodyHtml + < br /> + newHtml);

Answer 2

document.write（MDN documentation），当从文档头部的脚本标记等上下文调用时，会事先调用document.open（MDN documentation），这将是重新初始化文档，覆盖以前的任何内容。但是，如果您未明确调用document.write或document.open，则document.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.close和document.write。

作为旁注，为什么document.write需要在这里？这是不你实现这样的方式，并教导使用几乎从未在真实情况下使用的document.write这样的东西，无助于增加对web开发的了解

您可以通过引入innerHTML和getElementById并调整某个元素like in this fiddle的内容来获得相同的概念。

Javascript document.write里面的脚本

2 个答案: