帮我用vue 提取一下 这个a标签的网址和内容 <li class=""><a href="https://www.12371.cn/special/zcwj/" target=_blank>规范性文件</a></li>
时间: 2024-01-01 13:05:32 浏览: 31
可以使用Vue的模板语法和正则表达式来提取a标签的网址和内容,可以参考如下代码:
```html
<template>
<div>
<ul>
<li class=""><a href="https://www.12371.cn/special/zcwj/" target=_blank>规范性文件</a></li>
</ul>
<div v-if="url && text">
<p>网址:{{ url }}</p>
<p>内容:{{ text }}</p>
</div>
</div>
</template>
<script>
export default {
data() {
return {
url: null,
text: null,
};
},
mounted() {
const regex = /href="([^"]*)"[^>]*>([^<]*)<\/a>/;
const html = document.querySelector('.test li a').outerHTML;
const matches = html.match(regex);
if (matches) {
this.url = matches[1];
this.text = matches[2];
}
},
};
</script>
```
这里使用了正则表达式来匹配a标签中的网址和内容,提取出来后赋值给Vue实例的数据,然后在模板中展示。需要注意的是,这里使用了`querySelector`方法来获取DOM元素,需要保证DOM已经渲染完成。