一、首先什么是dom破坏
在HTML中,如果使用一些特定的属性名(id、name)给DOM元素命名,这些属性会在全局作用域中创建同名的全局变量,指向对应的DOM元素。这种行为虽然有时可以方便地访问元素,但也会引发一些潜在的问题,特别是在元素的属性名与JavaScript全局对象的属性名冲突时,可能会破坏正常的DOM操作或脚本运行。这种现象被称为DOM破坏。
二、dom破坏的原理
当DOM元素拥有id或name属性时,浏览器会自动在全局作用域创建一个同名的属性,指向该DOM元素。比如<div id="ok">会创建一个window.ok属性,指向这个div元素。如果元素的id或name属性与已有的JavaScript全局对象或内置属性名冲突,会覆盖原有的JS代码。
ok,boomer
首先来看源码
这里使用了DOMPurify第三方库,原理就是利用白名单,将非白名单内的属性和标签全部过滤。
setTimeout(ok,2000)中的ok可以接收一个函数或者字符串,而这道题的注入点就在这里的ok,
?boomer=<a%20id=ok%20href=tel:alert(1337)>
通过构造与setTimeout函数参数名相同的标签id,浏览器执行setTimeout函数时会查找HTML中id=ok的字符串类型的标签,而<a>标签被调用时回一个表示<a>标签的字符串即href属性中的值,因此setTimeout函数执行时会将<a>标签中href属性的值tel:alert(1)当作代码来执行,利用该框架中白名单函数tel来执行。