javascript - 我如何在这个 h1 标签中显示 uinput ?

标签 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>

最佳答案

获取标题标签的初始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);

关于javascript - 我如何在这个 h1 标签中显示 uinput ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59221795/

相关文章:

javascript - 调用变量 jQuery 函数

javascript - 如何使用 JavaScript 检测 AJAX 调用?

javascript - 有没有好的网站性能分析工具? (前端)

javascript - 未捕获的类型错误 : Cannot set property 'onclick' of null error

html - Wordpress CSS Sidebar 代码问题

javascript - 为什么 Node.js + express 应用程序不会因错误而崩溃?

从开始到第一个空格的 JavaScript 子字符串

javascript - 来自 PHP 的最新 XML 文件响应未加载到 Javascript 中

node.js - 在 EJS 中循环 JSON

html - 如何使用 CSS 自定义选择下拉框?