文章目錄
- 前言
- 一、pandas是什么？
- 二、使用步驟
- 1.引入庫
- 2.讀入數據
- 總結
一.什么是DOM破壞
????????在HTML中，如果使用一些特定的屬性名（如id或name）給DOM元素命名，這些屬性會在全局作用域中創建同名的全局變量，指向對應的DOM元素。這種行為雖然有時可以方便地訪問元素，但也會引發一些潛在的問題，特別是在元素的屬性名與JavaScript全局對象的屬性名沖突時，可能會破壞正常的DOM操作或腳本運行。這種現象被稱為DOM破壞（DOM clobbering）。
二.DOM破壞的原理
-
全局變量自動創建
- 當DOM元素擁有
id或name屬性時，瀏覽器會自動在全局作用域（即window對象上）創建一個同名的屬性，指向該DOM元素。例如，<div id="foo">會創建一個window.foo屬性，指向這個div元素。
- 當DOM元素擁有
-
屬性名沖突
- 如果元素的
id或name屬性與已有的JavaScript全局對象或內置屬性名沖突，會覆蓋原有的JS代碼。例如，如果有一個<input id="location">，它會覆蓋window.location，這會導致腳本中試圖訪問window.location時得到<input>元素，而不是期望的Location對象。
- 如果元素的
-
影響腳本執行
- 由于全局變量被覆蓋，腳本在訪問這些全局變量時會得到意外的結果，導致錯誤或不可預測的行為。
舉個例子 1：
<body>
<img id="x">
<img name="y">
<script>
console.log(x)
console.log(y)
console.log(document.x)
console.log(document.y)
console.log(window.x)
console.log(window.y)
</script>
</body>?運行結果：
<img id="x">
<img name="y">
<img id="x">
undefined
<img id="x">
<img name="y">
上述案例中，無需通過 getElementById 獲取<img>標簽，使得開發者更快速的獲取DOM節點。
案例 2：
????????上述案例中，在新創建的<div>標簽中插入一個<img>標簽并將該<div>標簽插入到<body>中，然而當我們利用document.cookie函數輸出網頁的cookie時，輸出的結果卻由空值改變成<img>標簽，造成這一現象的原因：元素的id或name屬性與已有的JavaScript全局對象或內置屬性名沖突，會覆蓋原有的JS代碼。
最后通過案例3來驗證一下：
???????
?案例3中，JS代碼想要在<body>標簽中插入新建的<div>標簽，然而執行時卻顯示找不到函數document.body.appendchild 的執行方法，報錯原因無非就是這段JS代碼被<img>標簽所覆蓋，瀏覽器執行的實際代碼為：
<img id-"appendChild">(div)????????通過案例1,2,3，不難發現這種行為雖然有時可以方便地訪問元素，但也會引發一些潛在的問題，特別是在元素的屬性名與JavaScript全局對象的屬性名沖突時，可能會破壞正常的DOM操作或腳本運行。這種現象被稱為DOM破壞。
? ? ? ? 在黑客的攻擊行為中，往往會利用DON破壞的特點，構造一個含有惡意腳本的惡意標簽從而與已有的JavaScript全局對象或內置屬性名沖突，覆蓋原有的JS對象，輸出惡意標簽
? ? ? ? 說到這里可能會有疑惑，惡意標簽按照原樣輸出有什么用？回答是：當然沒用啦，黑客通常會利用一些辦法將輸出的標簽轉換為字符串類型從而使得這些惡意標簽與某些執行參數為字符串類型的JS代碼的屬性名沖突時能夠被執行。
? ? ? ? 在HTML標簽中<a>標簽與<textarea>標簽自帶被調用時以字符串形式輸出的屬性，因此我們可以通過如下案例深入了解一下：
? ?上述案例中存在一個防御框架?DOMPurify,因此想要成功實現攻擊只能利用setTimeout函數，該函數將第一個字符串類型的參數ok延遲兩秒執行，利用此執行執特點，再配合DOM破壞可以構造如下惡意標簽?
<a id="ok" href="tel:alert(1)">
?上述惡意pyload通過構造與setTimeout函數參數名相同的標簽id，當setTimeout函數被調用時會查找HTML中id-ok的字符串類型的標簽，而<a>標簽被調用時正好為字符串形式，因此該函數執行時會調用黑客構造的惡意標簽<a>，同時執行當中的惡意腳本(這里若使用javascript會被防御框架過濾，因此利用該框架中1白名單函數tel，也可以執行JS腳本)。
??
總結
