为什么已定义元素和变量，仍出现 elem is not defined 引用报错？

• 你直接使用元素id作为变量名操作DOM，该行为属于部分浏览器的非标准兼容特性，本身就不推荐使用，更关键的是你没有在HTML中声明id为item1、item3的节点，浏览器没有办法自动生成对应的全局变量，自然会抛出Uncaught ReferenceError: item1 is not defined的报错。
• 你的HTML代码中仅定义了id为item2的容器，缺少item1、item3对应的DOM结构，就算用标准DOM获取方法也无法拿到对应元素。

如果你需要同时展示三个内容，首先补全HTML结构：

<div id="item1"></div>
<div id="item2"></div>
<div id="item3"></div>

再修改JS代码，使用标准方法获取DOM元素：

let itemOne = `<h2>Item One</h2>`;
let itemTwo = `<h2>Item Two</h2>`;
let itemThree = `<h2>Item Three</h2>`;

// 主动获取DOM节点，不要直接用id作为变量
document.getElementById('item1').innerHTML = itemOne;
document.getElementById('item2').innerHTML = itemTwo;
document.getElementById('item3').innerHTML = itemThree;

如果你仅需要展示item2的内容，不需要另外两个，直接删除JS中操作item1、item3的两行代码即可。

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