生活随笔
收集整理的這篇文章主要介紹了
innerHTML与innerText
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
（1）innerHTML對div標簽的控制
div標簽跟span標簽是不一樣的，div是一個層的塊，span是一行，我們下面看演示就知道區(qū)別了。先來看一段控制div的代碼。
<script?language="javascript"> ?function?chageDiv(number) ?{ ?if?(number?==?1)?{ ?document.getElementById("div1").innerHTML?=?"值為1"; ?} ?if?(number?==?2)?{ ?document.getElementById("div1").innerHTML?=?"值為2"; ?} ?} ?</script>? ?
DIV塊測試：<div id="div1">默認值</div>
<a href="#" onClick="chageDiv(1)">改變值為1</a>
<a href="#" onClick="chageDiv(2)">改變值為2</a>
?
運行的時候，點擊“改變值為1”那么“默認值”這個內容將會被改變?yōu)椤爸禐?”，但是注意其中的界面，就是會發(fā)現“DIV測試：”和“默認值”是兩行顯示的，因為DIV是按塊來顯示的。
（2）innerHTML對span的控制
與div類似，但是它是按照行來顯示的，看下面的代碼：
function?chageSpan(number) ?{ ?if?(number?==?1)?{ ?document.getElementById("span1").innerHTML?=?"值為1"; ?} ?if?(number?==?2)?{ ?document.getElementById("span1").innerHTML?=?"值為2"; ?} ?} ?</script>?
Span行測試：
?
<span id="span1">默認值</span><br>
<a href="#" onClick="chageSpan(1)">改變值為1</a>
<a href="#" onClick="chageSpan(2)">改變值為2</a>
?
當點擊“改變值為1”的時候，“默認值”將變?yōu)椤爸禐?”，但是“Span行測試”和“默認值”是在同一行顯示的，跟DIV不一樣。
另外一個值得注意的就是，不管是div還是span，后面的名字都是以為id來定義的，不是象表單一樣是使用name來定義的。
innerTEXT與innerHTML的區(qū)別：
?
?
<BODY> ?<div?id="d"?style="background-color:#ff9966">這是一個層</div>? ?<input?type="button"?value="獲取innerHTML"?οnclick="getinnerHTML()">? ?<input?type="button"?value="設置innerHTML"?οnclick="setinnerHTML()">? ?<script?language="javascript">? ?function?getinnerHTML()? ?{? ?alert(document.getElementById("d").innerHTML)? ?}? ?function?setinnerHTML()? ?{? ?document.getElementById("d").innerHTML="<div?id='d'?style='background-color:#449966'>這是一個層,嘿嘿</div>"? ?}? ?</script> ?<div?id="clock">這是一個層</div>? ?<script?language="javascript">? ?function?test()? ?{? ?var?timevalue?=?new?Date(); ?document.all.clock.innerText?=?timevalue.getYear()?+?"-"?+?(timevalue.getMonth()+1)?+?"-"?+?timevalue.getDay()?+?"?"?+?timevalue.getHours()?+?":"?+?timevalue.getMinutes(); ?}? ?</script>? ?<input?type="button"?value="獲取innerText"?Onclick="alert(clock.innerText)"> ?<input?type="button"?value="設置innerText"?οnclick="test()">? ? ?
轉載于:https://blog.51cto.com/huqianhao/953035
總結
以上是生活随笔為你收集整理的innerHTML与innerText的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
