innerHTML与XSS攻击

HTML5为所有元素提供了一个innerHTML属性，既能获取对象的内容又能向对象插入内容
属性值：HTML标签/文本
浏览器会将属性值解析为相应的DOM树
HTML解析器在浏览器中是底层代码比JavaScript方法快很多，同时意味着替换元素上的关联事件处理程序和JavaScript对象需要手动删除。

插入script和style元素的时候需要看具体的浏览器

XSS攻击

XSS攻击通常指的是通过利用网页开发时留下的漏洞，通过巧妙的方法注入恶意指令代码到网页，使用户加载并执行攻击者恶意制造的网页程序。这些恶意网页程序通常是JavaScript，
请记住两条原则：过滤输入和转义输出。

前端注意
.innerHTML、.outerHTML、document.write() 时要特别小心，不要把不可信的数据作为 HTML 插到页面上，而应尽量使用 .textContent、.setAttribute() 等。
解决跨域时候的jsonp方法也存在XSS隐患,去请求别的域，得到别的域返回的数据，万一是个脚本，就注入到自己的代码里了
如果用 Vue/React 技术栈，并且不使用 v-html/dangerouslySetInnerHTML 功能，就在前端 render 阶段避免 innerHTML、outerHTML 的 XSS 隐患。

防止cookie信息被盗
cookie中可以设置HttpOnly属性，那么通过js脚本将无法读取到cookie信息，这样能有效的防止XSS攻击，窃取cookie内容，这样就增加了cookie的安全性，即便是这样，也不要将重要信息存入cookie。

response.addHeader("Set-Cookie", "uid=112; Path=/; HttpOnly")

xss与csrf区别：
通常来说 CSRF 是由 XSS 实现的，CSRF 时常也被称为 XSRF（CSRF 实现的方式还可以是直接通过命令行发起请求等）。
本质上讲，XSS 是代码注入问题，CSRF 是 HTTP 问题。XSS 是内容没有过滤导致浏览器将攻击者的输入当代码执行。CSRF 则是因为浏览器在发送 HTTP 请求时候自动带上 cookie，而一般网站的 session 都存在 cookie里面。

outerHTML

==innerHTML定义的DOM树+自身元素

innerText与outerHTML:
innerText:后代的所有文本
删除后代DOM树，赋值文本内容