代码之家 › 专栏 › 技术社区 › Aditya

如何在html中显示javascript变量的值?[关闭]

html5 javascript

-8

Aditya · 技术社区 · 8 年前

我想显示输入值点击按钮“去”。输入值存储在名为“value”的变量中,并在id=“show”中可见。

<html>
<head>
</head>

<body>

<div>
<input type="text" id="input" />
<button onclick="go()">Click</button>
</div>

<div id="show" style="display: none;">
<p>${value}</p>
</div>

<script>


function go() {
    document.getElementById('show').style.display = "block";
   let value = document.getElementById('input').value;
}
</script>
</body>

</html>

2 回复 | 直到 8 年前

Scott Marcus 8 年前

你只要把 .textContent 它将显示在变量中的元素的。不需要隐藏/显示元素,因为元素 文本内容 一开始是空的(所以它最初不会显示任何内容)。

<html>
<head>
  <title>Using form data in the page</title>
</head>
<body>
  <div>
    <input type="text" id="input">
    <button onclick="go()">Click</button>
  </div>

  <div id="show"></div>

  <script>
    function go() {
      let value = document.getElementById('input').value;
      document.getElementById('show').textContent = value;
    }
  </script>
</body>
</html>

mplungjan 8 年前

使用type=“按钮”
使用值更新p,不隐藏和不引人注目的事件处理:

document.querySelector("#go").onclick=function() {
  document.querySelector('#show>p').textContent = document.getElementById('input').value;
}

<div>
  <input type="text" id="input" />
  <button type="button" id="go">Click</button>
</div>

<div id="show">
  <p></p>
</div>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前