马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有账号?立即注册
x
结果图:
需求:点击加号执行后端返回的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>
复制代码 vue js部分
- 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)
- },
- }
复制代码 result1打印结果:
欣赏器展示script标签位置:
------------------------------------------------------end----------------------------------------------------------------------
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。 |