js中innerHTML與innerText的用法與區別

          用法:

          <div id="test">
             <span style="color:red">test1</span> test2
          </div>

          在JS中可以使用:

          test.innerHTML:

            也就是從對象的起始位置到終止位置的全部內容,包括Html標簽。

            上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> test2 ”。

          test.innerText: 

            從起始位置到終止位置的內容, 但它去除Html標簽 

            上例中的text.innerTest的值也就是“test1 test2”, 其中span標簽去除了。

          test.outerHTML:

            除了包含innerHTML的全部內容外, 還包含對象標簽本身。

            上例中的text.outerHTML的值也就是<div id="test"><span style="color:red">test1</span> test2</div>


          完整示例:

          <div id="test">
             <span style="color:red">test1</span> test2
          </div>

          <a href="javascript:alert(test.innerHTML)">innerHTML內容</a>
          <a href="javascript:alert(test.innerText)">inerHTML內容</a>
          <a href="javascript:alert(test.outerHTML)">outerHTML內容</a>

          特別說明:

            innerHTML是符合W3C標準的屬性,而innerText只適用于IE瀏覽器,因此,盡可能地去使用innerHTML,而少用innerText,如果要輸出不含HTML標簽的內容,可以使用innerHTML取得包含HTML標簽的內容后,再用正則表達式去除

           

           

          HTML標簽,下面是一個簡單的符合W3C標準的示例:

          <a href="javascript:alert(document.getElementById('test').innerHTML.replace(/<.+?>/gim,''))">無HTML,符合W3C標準</a>

          posted on 2009-03-28 14:09 luofeng225 閱讀(8443) 評論(4)  編輯  收藏 所屬分類: Javascript

          評論

          # re: js中innerHTML與innerText的用法與區別 2009-03-30 12:46 wjing63

          通俗易懂  回復  更多評論   

          # re: js中innerHTML與innerText的用法與區別 2013-02-18 16:48 adsf

          sdfa  回復  更多評論   

          # re: js中innerHTML與innerText的用法與區別 [未登錄] 2013-03-29 10:28 丫丫

          挺好的  回復  更多評論   

          # re: js中innerHTML與innerText的用法與區別 2013-05-25 16:24 aawu

          innerTest???  回復  更多評論   


          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          <2013年5月>
          2829301234
          567891011
          12131415161718
          19202122232425
          2627282930311
          2345678

          導航

          統計

          公告

          我曾經聽到這么一個故事: 一個年輕的程序員問一個老程序員(一個比較牛逼的公司的CTO) 年輕程序員: 你為什么這么牛X., 就好像沒有你不會的。老程序員: 積累的。年輕程序員: 怎么才能積累到您的程度呢。我每天都在積累。但是似乎都沒有感覺到進步。老程序員: 我從20歲開始做到了一件事情,直到今天,而且盡可能地保證不間斷。年輕程序員: 到底是什么? 老程序員: 我每天保證自己有2個小時在學習新的東西。

          常用鏈接

          留言簿(3)

          隨筆分類

          隨筆檔案

          文章分類

          相冊

          收藏夾

          Java Website

          java技術博客

          搜索

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 华蓥市| 昂仁县| 太仓市| 绥化市| 宁武县| 康定县| 松潘县| 保山市| 天水市| 焉耆| 阿荣旗| 瓦房店市| 太原市| 惠水县| 建宁县| 兴义市| 海门市| 梧州市| 高邑县| 乐安县| 锡林郭勒盟| 葫芦岛市| 宁津县| 皋兰县| 黑山县| 嘉祥县| 宝坻区| 武城县| 中山市| 自治县| 时尚| 凌海市| 临江市| 观塘区| 古浪县| 井研县| 长丰县| 页游| 西安市| 望城县| 西青区|