为何getElementById获取元素value返回undefined？附代码示例

先看你贴的代码：

<body> 
  <p id = "demo">fffffffff</p> 
  <button onclick = "fun()">click</button> 
  <script type="text/javascript" defer = "defer"> 
    function fun(){ 
      alert(document.getElementById("demo").value); 
    } 
  </script> 
</body>

问题出在**<p>标签根本没有value属性**！

value是表单类元素（比如<input>、<textarea>、<select>这类用来收集用户输入的标签）专属的属性，而<p>只是用来展示文本的段落标签，它的内容是存在textContent或者innerHTML属性里的，不是value。

你只需要把代码里的.value改成.textContent就能正常获取段落里的文本了：

function fun(){ 
  alert(document.getElementById("demo").textContent); 
}

如果你的段落里包含HTML标签（比如<b>、<i>），想要获取带HTML结构的内容，就用.innerHTML代替.textContent。

另外，要是你想让这个段落可以被用户编辑，可以给<p>加上contenteditable="true"属性，但即便如此，它依然没有value属性，获取内容还是得用textContent或者innerHTML哦。

内容的提问来源于stack exchange，提问作者user8930932