我正在使用这个网站https://ionic.io/ionicons为我的按钮添加图标,并且在声明新元素(将包含图标)时使用HTML非常简单。你只需要声明一个按钮,然后把这个放进去:ion-icon name="trash-outline"></ion-icon>
。然而,我不知道如何用javascript创建图标元素,因为我必须使用。createelement在某些时候,为了使一个按钮出现在网页上。任何想法?
我尝试了下面的操作,但没有成功:
let dltButton = document.createElement('button');
dltButton.innerHTML = "<ion-icon name="trash-outline"></ion-icon>";
不是一个正式的HTML标签,是吗?所以我想这就是JS不能创建它的原因。
试试下面的代码:
<html>
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
<body>
<script>
let dltButton = document.createElement('button');
dltButton.innerHTML = '<ion-icon name="trash-outline"></ion-icon>';
document.body.appendChild(dltButton);
</script>
</body>
</html>
问题可能是你的innerHTMl是双引号而不是单引号。