getElementById返回undefined，如何获取DOM元素的value属性值

<h1>属于非表单元素，本身并不具备原生的value属性，你手动添加的value="test"是自定义属性，直接用.value无法读取。可以通过以下两种方式获取该值：

方法一：使用getAttribute()读取自定义属性 #

修改你的redeem.js代码：

const guest = document.getElementById('redeem').getAttribute('value');
console.log("redeeem.js working");
console.log(guest); // 输出：test

方法二：使用HTML5规范的data-*属性（推荐） #

先调整客户端的HTML代码，将自定义属性改为data-前缀的格式：

<h1 id="redeem" data-value="test">Header 1</h1>

然后在redeem.js中通过dataset读取：

const guest = document.getElementById('redeem').dataset.value;
console.log("redeeem.js working");
console.log(guest); // 输出：test

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