Question

我使用了2个我想要的功能当我点击按钮它应该清除第一个功能结果的输出但是当我使用时它不起作用.innerHTML =“”;怎么做？

function HalfRightTriangle() {
        for (var i = 1; i <=7; i++) {
            for (var j = 1; j <i; j++) {
            // document.write("*"); 
             document.getElementById("result").innerHTML += "*";
          } // end of inner for loop 
          document.getElementById("result").innerHTML += "<br>";
       } // end of outer for loop 
       document.getElementById("result").innerHTML += "";
    } // function end

Answer 1

如果您只使用文字，最好只使用变量，然后在完成后将其设置为innerHTML。

这样的事情：

function HalfRightTriangle() {
    var inner = document.getElementById("result").innerHTML;
    for (var i = 1; i <= 7; i++) {
        for (var j = 1; j < i; j++) {
            inner += "*";
        } // end of inner for loop
        inner += "<br>";
    } // end of outer for loop
    document.getElementById("result").innerHTML = inner;
} // function end

Answer 2

如果你使用容器控件显示你的结果然后内部html工作，但如果没有容器控件然后使用java脚本的val函数。示例

<div id=result>

<label id=result></label>

</div>
<script type=text/java script>

$('#result').html("")

$('#result').val("")
</script>

Answer 3

解决方案：

<script type="text/javascript">

    function HalfRightTriangle() {
        for (var i = 1; i <=7; i++) {
            for (var j = 1; j <i; j++) {

                // document.write("*"); 
                document.getElementById("result").innerHTML += "*";

            } // end of inner for loop 

            document.getElementById("result").innerHTML += "<br>";

        } // end of outer for loop 


    } // function end

    document.getElementById("result").innerHTML = "";

    function HalfLeftTriangle() {
        for (var i = 7; i >=1; i--) {
            for (var j = 1; j <=i; j++) {

                // document.write("*"); 
                document.getElementById("result").innerHTML += "*";

            } <!-- end of inner for loop -->

            //document.write("<br>");
            document.getElementById("result").innerHTML += "<br>";
        } <!-- end of outer for loop -->

    } // function end
    document.getElementById("result").innerHTML = "";


</script>
</head>
<body>

<button type="button" onclick="HalfRightTriangle();"> Half Right Triangle </button>
<button type="button" onclick="HalfLeftTriangle();"> Half Left Triangle </button>
<br><br>
<div id="result"> Result Here </div>

清除功能内部的Div内容

3 个答案: