js创建一个<svg class="iconfont" aria-hidden="true" (click)="closeModel()"> <use xlink:href="#iconclose"></use> </svg>
时间: 2023-10-28 13:06:18 浏览: 189
以下是使用 JavaScript 创建一个包含 SVG 图标的元素的示例代码:
```javascript
// 创建 SVG 元素
var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttribute('class', 'iconfont');
svg.setAttribute('aria-hidden', 'true');
svg.addEventListener('click', closeModel);
// 创建 use 元素
var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
use.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', '#iconclose');
// 将 use 元素添加到 SVG 元素中
svg.appendChild(use);
// 将 SVG 元素添加到 DOM 中
document.body.appendChild(svg);
```
在上面的代码中,我们使用 `document.createElementNS()` 方法创建一个 SVG 元素,并使用 `setAttribute()` 方法设置其 `class` 和 `aria-hidden` 属性。然后,我们使用 `addEventListener()` 方法为 SVG 元素添加一个点击事件,该事件将调用名为 `closeModel()` 的函数。
接下来,我们使用 `document.createElementNS()` 方法创建一个 use 元素,并使用 `setAttributeNS()` 方法设置其 xlink:href 属性。然后,我们将 use 元素添加到 SVG 元素中。
最后,我们将 SVG 元素添加到页面的 `body` 元素中。请注意,如果您想要将 SVG 元素添加到页面的其他位置,请更改最后一行的代码。
阅读全文