我如何在此h1标签中显示uinput?

时间:2019-12-06 23:59:35

标签: javascript html

我想让uinput后面的h1标签中出现Hello。它应该显示他们在上一页中添加的用户名。

<body>
    <div class="Header_2">
        <div class="Head-Text-Box">
            <script>
                var userinput = localStorage.getItem("uinput");
            </script>
            <h1>Hello uinput <br> please choose from the options below</h1>
        </div>
    </div>    
</body>

1 个答案:

答案 0 :(得分:1)

获取标题标签的初始innerHTML并将innerHTML替换为您的变量值:

<div class="Header_2">
        <div class="Head-Text-Box">
            <h1>Hello {uinput} <br> please choose from the options below.</h1>
            <script>
                var userinput = "Sixpathsage6";//localStorage.getItem("uinput");
                var h = document.querySelector("h1");
                h.innerHTML = h.innerHTML.replace("{uinput}",userinput);
            </script>
        </div>
    </div>    

使用正则表达式替换多个{uinput}

h.innerHTML.replace(/\{uinput\}/g, userinput);