vue2 获取 v-html 中p标签的属性值
时间: 2024-03-23 21:42:52 浏览: 287
在Vue中获取v-html中的p标签的属性值可以通过以下步骤实现:
1. 在p标签上添加一个`ref`属性,例如`<p ref="myParagraph" class="my-class" data-id="123">Hello World</p>`,其中`ref`属性的值为`myParagraph`。
2. 在Vue组件中使用`this.$refs`来获取p标签的引用,在生命周期钩子函数`mounted`中可以这样获取p标签的引用:`const paragraph = this.$refs.myParagraph`。
3. 通过获取到的p标签的引用,可以通过`getAttribute`方法获取p标签的属性值,例如获取`data-id`属性值的代码如下:
```javascript
const paragraph = this.$refs.myParagraph;
const dataId = paragraph.getAttribute('data-id');
console.log(dataId); // 输出:123
```
需要注意的是,因为v-html是动态渲染的HTML内容,可能存在安全风险,因此在使用v-html时需要谨慎处理。
阅读全文