站長資訊網
方法：1、使用innerHTML設置或獲取標簽所包含的HTML+文本信息(從標簽起始位置到終止位置全部內容，包括HTML標簽)；2、使用innerText設置或獲取標簽所包含的文本信息（從標簽起始位置到終止位置的內容，去除HTML標簽）。
本教程操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。
針對這個問題，可以分為兩種情況：一種是只包含&、<、>、'的html實體，另一種是廣義的實體，不只局限于上面的情況。對于后者，在我看來，除了列舉出所有的實體符號，寫switch case語句，還真的沒有什么好辦法。（如果您有什么好辦法，請不吝賜教。）。針對前者的話，其實原生js就支持。例如會自動對文本中存在的HTML語法字符（小于號、大于號、引號及和號）進行編碼的節點的innerText屬性（FireFox中是textContent屬性。
實際上二者并不完全一樣，innerText會忽略行內樣式和腳本，而textContent則會原樣返回行內樣式和文本。）。其原理是設置innerText會生成當前節點的一個子文本節點，而為了確保只生成一個子文本節點，就需要對文本進行HTML編碼。innerHTML雖然也可以做到，但它轉變的只是標簽的文本。下面的例子展示了它們的不同。
var div=document.createElement('div'); div.innerText='<p>hello & world</p>'; div.innerText //<p>hello & world</p>" div.innerHTML //"<p>hello & world</p>" div.innerHTML='<p>hello & < world</p>' div.innerHTML //"<p>hello & < world</p>" div.innerText //"hello & < world"
從上面例子中可以看到二者的區別：innerText會將所有的文本轉義（當然也不是全部文本，比如空格就不會），innerHTML則是對標簽內的文本進行轉義，標簽如<p>就不會轉義，但孤立的小于大于號還是會進行轉換的。（上面代碼中innerHTML之所以設置的內容和解析后的內容不一樣，是因為返回的是瀏覽器根據原始字符串解析為DOM樹后經過序列化之后的結果。）根據上面程序的結果，我們可以得到簡單的轉換函數：
//僅限于包含`&、<、>、'`的文本轉換 function stringToEntity(str){ var div=document.createElement('div'); div.innerText=str; div.textContent=str; var res=div.innerHTML; console.log(str,'->',res); return res; }
其實除了innerText，還可以通過創建文本節點的方式來完成轉義，即使用document.createTextNode()。這種方法大部分的應用場景是對用戶輸入進行轉義。例如業務需要，我們需要把用戶的輸入寫到網頁上，不做轉義直接將用戶輸入寫到網頁上往往是行不通的，因為容易出現XSS漏洞。不過我們可以通過document.createTextNode()方法將用戶輸入作為文本節點，然后再插入到文檔中。該方法會對出現的特殊標記進行轉義。例如如下代碼：
var str="<img src='a valid url' οnlοad='alert(1)'></img>"; var text=document.createTextNode(str); $("container").appendChild(text);
上述代碼中如果不加轉義直接使用$("container").innerHTML=str;就會使得圖片加載完運行onload里面的代碼，如果代碼是惡意的，就會為我們網站的用戶造成損害。而將小于號、大于號轉義后就不會出現這個問題了。
【推薦學習：javascript高級教程】
