DOM概述

DOM，全称“DocumentObjectModel（文档对象模型）”，它是由W3C组织定义的一个标准。前端开发页面时，要改变页面的某个元素，就需要通过DOM来实现。

HTML DOM的常用方法

• getElementById(id)：获取带有指定id的节点
• appendChild(none)：插入新的子节点
• removeChild(node)：删除字节点

HTML DOM常用属性

• innerHTML：节点的文本值
• parentNode：节点的父节点
• childNodes：节点的字节点
• attribute：节点的属性节点

pikachu实验-DOM型xss

首先，打开pikachu靶场的DOM型xss，接着F12打开页面调试器进行简单的代码审计。

从调试器中可以看到，在输入框输入的值点击提交之后，这个值被插入了下面的a标签的href中，a标签的href是用来存放链接地址的。具体如何实现的，还需要进一步查看按钮的点击事件。

domcss()函数解析

这里的domcss()函数先通过document.getElementById('text').value获取了id为text的节点的value，再通过document.getElementById('dom').innerHTML获取到id为dom的节点并把刚刚获取到的值和a标签拼接插入页面中。

尝试payload

既然这里的a标签是拼接出来的，我们就可以尝试拼接一些简单的html语法进行测试。

• 原网页的a标签拼接代码:<a href='str'>what do you see?</a>
• 测试代码:' onclick=alert(111)">
• 把测试代码填入输入框提交此时a标签代码就变成 <a href='' onclick=alert(111)">'>what do you see?</a>用'把href闭合，再用>把a标签闭合。

弹框成功证明这里是存在DOM型xss漏洞的，点到为止。