CSS3：在按钮中注入一个字形图标答案

【问题标题】：CSS3 : inject a glyphicon icon in a buttonCSS3：在按钮中注入一个字形图标
【发布时间】：2018-03-30 03:55:28
【问题描述】：

在我的 Angular5 应用程序中，我有一个日期选择器库，它使用一些按钮呈现一个日期选择器

在那些按钮中，我想注入一些图标。

检查页面时； html结构会是这样的

<button>
<i class="glyphicon glyphicon-chevron-left"></i>
<button>

但由于我不允许修改 html 视图，我无法直接在 html 中添加此图标：

<i class="glyphicon glyphicon-chevron-left"></i>

解决办法就是用css来做。

建议？

【问题讨论】：

【解决方案1】：

Glyphicon 使用伪类:before 和:after 来注入图标。

在此元素上使用:after 伪类并尝试添加此特定图标的代码。应该是这样的：

.glyphicon.glyphicon-chevron-left:after{ content:"\e079"; }

代码中使用的内容会有所不同。您可以在“CSS 规则”中的 link 中仔细检查它。另请记住，您可能需要正确设置样式以保证其可见性。

祝你好运！

【讨论】：

【解决方案2】：

通过JS你可以这样做：

var elem = document.getElementsByTagName('button');
elem[0].innerHTML += "<i class='glyphicon glyphicon-chevron-left'></i>";

【讨论】：