结果图：
需求：点击加号执行后端返回的script中的代码
后端返回的html：
现在如果直接用 v-html 放到vue 中 会报错；报这个方法没有；
办理思路：
1.获取到后端返回的html
2.通过正则表达式 之后 截取script 中的 js 逻辑
3.获取body标签 之后创建一个 script 标签
4.把我们截取的 script中的代码放到我们创建的 script标签中
5.把script标签 放到body中
实现：
html部分：
- <div v-html="htmlData"></div>
- export default {
- data() {
- return {
- htmlData: ""
- }
- },
- mounted() {
- // 我是取的本地存储的 你换成后端返回的就行
- this.htmlData = localStorage.getItem('callbackHTML')
- // 正则匹配
- const regex = /<script type="text\/javascript">([\s\S]*?)<\/script>/g;
- // let result = regex.exec(this.htmlData) //获取匹配到的数据
- // console.log(result);
- // let result0 = regex.exec(this.htmlData)[0] // 0是带<script
- type="text\/javascript"> 这个的
- // console.log(result);
- let result1 = regex.exec(this.htmlData)[1]// 1是不带<script type="text\/javascript"> 这个的 我们用1
- console.log(result1);
- //创建script标签
- let script = document.createElement('script')
- script.type = 'text/javascript'
- script.text = result1
- //插入到body中
- document.getElementsByTagName('body')[0].appendChild(script)
- },
- }
欣赏器展示script标签位置：
------------------------------------------------------end----------------------------------------------------------------------
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。 |
