博客园上给自己的博客添加 iconfont 图标

一、相关知识：

1. JavaScript HTML DOM：通过 HTML DOM，JavaScript 能够访问和改变 HTML 文档的所有元素。
2. setAttribute()：setAttribute() 方法创建或改变某个新属性。（如果指定属性已经存在，则只设置该值。）

二、给博客添加 iconfont 图标。

1.首先打开iconfont图标_阿里巴巴矢量图标库，为了后续使用相关图标，我们可以先注册账号并登陆。

2.搜索自己想要的图标，并添加入库中；点击右上角的图标“购物车”，然后将刚刚的图标添加到一个自己新建的项目中。

3.在我的图标中，可以看到刚刚的项目，我们点击获取 css 链接。使用时记得在链接前加上 https:！
如：https://at.alicdn.com/t/font_1446089_k4mvsswslng.css

4.先将 css 链接 写在 head 元素中。

5.此处我们修改的是博客上的导航栏，因为博客园不能直接修改 html 代码，所以使用 JavaScript HTML DOM 来修改它。使用 iconfont 图标时，

就会出现一个图标，即给 html 标签一个值为“iconfont 图标名”的 class 属性。

6.将上述代码写入博客园的页首 html 中。

7.之后进行图标颜色修改，相关 css 代码重写，得到下列效果。（当然，我模仿的B站。。）