[DOM]-11.XSS跨網站指令碼注意事項

innerHTML

-方法：組完字串後，傳進語法進行渲染
-優點：效能快
-缺點：資安風險，要確保資料來源沒問題


craeteElement

-方法 ：以DOM節點來處理
-優點：安全性高
-缺點：效能差


XSS(跨站指令攻擊)：蓄意用HTML標籤與JavaScript埋一些惡意程式碼來攻擊的動作

<textarea name="" id="content" cols="30" rows="10"></textarea>
<input type="button" id="send" value="送出">
<div id="main"></div>

document.querySelector('#send').onclick= function(){
  var str = document.querySelector('#content').value;
  document.querySelector('#main').innerHTML = str;
}

如在表單駭客可自行利用JavaScript的語法載入，例如在表單上打<script>alert('你被入侵了');</script>，可偷資料庫也可攻擊能力用JavaScript的語法去改寫成能載入的檔案進去，能亂塞JavaScript的語法，所以innerHTML盡量不要作成表單.可信任的資料如Open data等等可以使用innerHTML

codepen