这是我参与更文挑战的第1天，活动详情查看：更文挑战
今天遇见了一个视频相关的问题，有的安卓手机打开带页面后，所有视频会同时自动播放。由于页面是v-html渲染的，查其原因，竟然是后台传过来的html富文本的视频是由iframe标签渲染的，由于视频是在老项目的后台人工上传的，数据量又很大，修改上传源头的标签是不现实的，只能研究一下iframe标签渲染视频的规则了。
1、iframe标签自带属性
使用iframe渲染视频，iframe会把视频自动渲染成一个video标签，且带有如下属性：
<video src="xxx.mp4" autoplay="true" name="media" controls>
由于iframe标签渲染视频后，自带autoplay="true"属性，且无法寻找到好的方法对iframe渲染后的内容进行改变，所以我想到了使用js的replace方法把iframe替换为video。
2、video标签autoplay的使用
把后台传过来的富文本的iframe替换为video：
this.content = content.replace(/iframe/g,'video controls')
为了避免同事的手机还是有自动播放的问题，我还特意加了autoplay=false
this.content = content.replace(/iframe/g,'video controls autoplay=false')
这一加不要紧，直接导致出现了问题
v-html在渲染video标签时，会把autoplay=false 解析为 autoplay="false"，"false"为字符串，即autoplay=true。导致视频继续存在自动播放的问题。
根据w3c标准，在html中，video标签如果不加autoplay属性，则默认autoplay为false，所以去掉autoplay即可。
this.content = content.replace(/iframe/g,'video controls')
3、autoplay属性的总结
在各个场景中使用video的autoplay属性如果想设置为false,可以参考如下内容：
- vue-> :autoplay="false"
- 小程序-> autoplay="{{false}}"
- html中-> 不能写autoplay属性，写了不管定义什么值都等于true
由于本次遇见的是使用v-html对富文本进行渲染，所以只需要去掉autoplay属性即可。
