JavaScript innerHTML 與 innerText 基本語法
HTMLDOMObject.innerText、HTMLDOMObject.innerText
兩者的基本語法原則上非常類似,差別在於運作後的結果。JavaScript innerHTML 與 innerText 範例
<script type="text/javascript">
function ChangeFontColor(){
var OriginalFont_1=document.getElementById("StringFont_1").innerHTML;
var OriginalFont_2=document.getElementById("StringFont_2").innerText;
document.getElementById("StringFont_1").innerHTML='<font color="blue">'+OriginalFont_1+'</font>';
document.getElementById("StringFont_2").innerHTML=OriginalFont_2;
}
</script>
<p id="StringFont_1">透過 innerHTML 將文字變為藍色</p>
<p id="StringFont_2"><font color='blue'>透過 innerText 將文字變為黑色</font></p>
<input type="button" value="變更文字顏色" onclick="ChangeFontColor()">
以上範例輸出結果function ChangeFontColor(){
var OriginalFont_1=document.getElementById("StringFont_1").innerHTML;
var OriginalFont_2=document.getElementById("StringFont_2").innerText;
document.getElementById("StringFont_1").innerHTML='<font color="blue">'+OriginalFont_1+'</font>';
document.getElementById("StringFont_2").innerHTML=OriginalFont_2;
}
</script>
<p id="StringFont_1">透過 innerHTML 將文字變為藍色</p>
<p id="StringFont_2"><font color='blue'>透過 innerText 將文字變為黑色</font></p>
<input type="button" value="變更文字顏色" onclick="ChangeFontColor()">
透過 innerHTML 將文字變為藍色
透過 innerText 將文字變為黑色
延伸閱讀