如何用JavaScript向指定DIV添加自定义<a>标签按钮而非文本？

嘿，这个问题我太熟悉了！你想用document.createElement来构建那个带图标span的链接，而不是把它当成纯文本插进去，其实分几步就能轻松搞定，我给你一步步拆解：

首先，先拿到你要插入内容的目标容器：

const targetDiv = document.getElementById('something');

接下来创建<a>标签，给它设置好跳转地址：

const readMoreLink = document.createElement('a');
readMoreLink.href = '/news_events/';

然后创建里面的图标span，加上指定的类名：

const iconSpan = document.createElement('span');
iconSpan.className = 'picon-p-add-news';

现在要把span和文本都放到a标签里——这里注意别直接用字符串拼接，用createTextNode来创建文本节点，这样能确保内容被正确识别为文本而不是HTML：

readMoreLink.appendChild(iconSpan);
readMoreLink.appendChild(document.createTextNode('Read more news'));

最后把组装好的a标签插入到目标div里就大功告成了：

targetDiv.appendChild(readMoreLink);

如果你想更简洁一点，也可以用insertAdjacentHTML直接插入整段HTML字符串，不过用createElement的方式更符合标准DOM操作，还能避免潜在的XSS风险，推荐优先用上面的方法~

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