【vue】v-html

v-html，会更新元素的innerHTML属性。

<template>
    <p v-html="htmlFragment"></p>
</template>

<script>
const data = {
    htmlFragment:"<span style='color:red'>hello world</span>"
}
export default {
    data(){
        return data;
    }
}
</script>

但是，v-html是一个危险分子，非常容易引入XSS攻击。
跨站脚本攻击，全称cross site scripting，缩写本应是CSS，为了和层叠样式表(CSS，cascading style sheet)区分开，所以就改叫XSS了。
攻击者向有XSS漏洞的网站输入恶意HTML代码，当用户访问网站时，这段恶意代码就会执行，从而达到攻击的目的。

看个例子。

<template>
    <p v-html="htmlFragment"></p>
</template>

<script>
const data = {
    htmlFragment:'hello world<img src=x οnerrοr=alert("attacking!") />'
}
export default {
    data(){
        return data;
    }
}
</script>