document.createElement('button')创建图标时怎么使用elementplus的图标

`document.createElement('button')` 是一个在浏览器中创建 DOM 元素的标准 JavaScript 方法。而 Element Plus 是一个基于 Vue 3 的组件库，它提供了许多封装好的 UI 组件，包括图标。如果你想在使用 `document.createElement('button')` 创建的原生按钮中使用 Element Plus 的图标，你需要将 Element Plus 的图标组件转换为可以直接插入到 DOM 中的图标元素。

目前 Element Plus 并没有提供直接将图标组件转换为 DOM 元素的 API，因此，你可以使用以下方法来实现：

1. 使用 Element Plus 的图标的 CSS 类（例如 `el-icon-arrow-up`）来创建一个带有图标的 `<i>` 标签，并通过样式调整使其表现得像一个按钮。

2. 如果你确实需要直接在原生 DOM 元素中使用 Element Plus 的图标组件，你可能需要手动克隆 Element Plus 图标组件的 SVG 结构，并将其作为按钮的子元素。

这里提供一个使用 Element Plus 的图标类创建按钮并显示图标的基础示例：

// 假设你已经在你的项目中全局引入了 Element Plus 的样式和图标样式
// 首先，创建一个按钮元素
const button = document.createElement('button');

// 然后创建一个图标元素，并添加到按钮中
const icon = document.createElement('i');
icon.className = 'el-icon-arrow-up'; // 这里的类名应与 Element Plus 图标相对应
button.appendChild(icon);

// 现在，按钮中应该显示了图标
document.body.appendChild(button); // 将按钮添加到页面的 body 中

请注意，这个方法只是简单地将图标作为文本样式显示，并不是实际使用 Element Plus 图标组件。如果你需要完全使用 Element Plus 图标组件的功能，你可能需要考虑将整个应用构建为 Vue 应用，以便使用 Element Plus 的组件。