Question

我正在尝试用单词创建一个随机短语生成器。我的问题是得到一个新的短语我必须首先刷新页面，然后它创建一个新的短语。我希望它能够在不刷新整个页面的情况下生成短语，或者至少使用相同的按钮生成和刷新这里是我的代码。

var output = "hai " + randomBodyPart + " come un "  + randomWord + " " + randomAdjective + "!";

//Pagereloder
            function myFunction() {
                location.reload();
            }

//Genretor Button
          var button = document.querySelector("button");
          button.addEventListener("click", function() {
                (document.getElementById("viewer").innerHTML= output);
          });

这是HTML

<article>
                <header>
                    <h1>Random word Genretor</h1>
                    <p class="gen-button"><button class="btn">Click me</button><button class="btn" onclick="myFunction()">Relod</button></p>
                    <h2 id="viewer">Here</h2>
                </header>

Answer 1

<button id="myButton">Click to change the number</button>
<span id="randomNumber"></span>
<script type="text/javascript">
    (function(d) {
        var button = d.getElementById("myButton");
        var textNumber = d.getElementById("randomNumber");
        button.addEventListener("click", function(evt) {
            textNumber.innerHTML = _randomNumber();
        });

        var _randomNumber = function() {
            return Math.floor((Math.random() * 10) + 1);
        }
    })(document);
</script>

为随机文本创建按钮和容器。
捕获两个元素。
为按钮添加一个监听器。
当有人点击您要更改内部HTML的按钮时，请在回调中执行此操作。
我用随机数改变了innerHtml ......这是一个正确的例子=）
param在那里举行，因为如果你想对事件做些其他事情，你可以删除它，如果你想要的话。
我也给你一个兔子：
（| _ /）
（＃。*）
C（ “）（”）
享受！

Answer 2

将代码抛出一个函数并调用该函数按钮：

            function myFunction() {
                var output = "hai " + randomBodyPart + " come un "  + randomWord + " " + randomAdjective + "!";
                document.getElementById("viewer").innerHTML= output
            }

//Genretor Button
          var button = document.querySelector("button");
          button.addEventListener("click", function() {
                myFunction();
          });

此外，随机发生器也必须在你的功能之内。

如何在没有刷新或刷新的情况下更改innerHTML并使用javascript中的相同按钮输出

2 个答案: