zoukankan      html  css  js  c++  java
  • 关于innerhtml的解释

           简单的说:
           innerhtml就是把东东插入此对象的二个HTML代码之间,并清空旧的中间的东东,   如a_id.innerHTML   =   "dddd";本来的<a>kkkk</a>变成<a>dddd</a>
          补充说明:
          就是在对象的的二个HTML格式符之间清空原来的内容,再插入新内容,而OUTERHTML是把对象本身包含子对象清空,然后在它这个位置插入新的内容,而INNERTEXT却是插入文本,当包含有如<等HTML格式符的关键字符时,会自动转义,反正你插入的内容全显示,而XHTML即当做一段HTML来解释,HTML格式代码是不会显示的,  
       
       
      下面是一个网上朋友弄的不错的测试,  
       
       
      <html>  
      <head>  
      <title>无标题</title>  
      <head>  
      <body>  
      在下面输入你要替换的内容,文本或HTML  
      <textarea   id=mytext   style="100;   height:200"></textarea>  
      <input   type=button   value=innerHTML   onclick=myreplace(this.value)>  
      <input   type=button   value=innerText   onclick=myreplace(this.value)>  
      <input   type=button   value=outerHTML   onclick=myreplace(this.value)>  
      <input   type=button   value=outerText   onclick=myreplace(this.value)>  
      <script   language   ='javascript'>  
      <!--  
      function   myreplace(how)  
      {  
            if(document.getElementById("show")   ==   null)  
                      document.body.insertAdjacentHTML(   'beforeEnd',   "<div   id=show   title=显示区域><input   value=显示区域></div>");          
            switch(how)  
            {  
                  case   "innerHTML":  
                      alert("未使用INNERHTML前的SHOW这个DIV的HTML代码如下:\n"   +   show.outerHTML);  
                      show.innerHTML   =   mytext.value;  
                      alert("使用INNERHTML的SHOW这个DIV的HTML代码如下:\n"   +   show.outerHTML);  
                      break;  
                  case   "innerText":  
                      alert("未使用INNERtext前的SHOW这个DIV的HTML代码如下:\n"   +   show.outerHTML);  
                      show.innerText   =   mytext.value;  
                      alert("使用INNERtext的SHOW这个DIV的HTML代码如下:\n"   +   show.outerHTML);  
                      break;  
                  case   "outerHTML":  
                      alert("未使用outerhtml前的SHOW这个DIV的HTML代码如下:注意,用这个后,SHOW对象将不存在\n"   +   document.body.outerHTML);  
                      show.outerHTML   =   mytext.value;  
                      alert("使用outerHTML的SHOW这个DIV的HTML代码如下:\n"   +   document.body.outerHTML);  
                      break;  
                  case   "outerText":  
                      alert("未使用outertext前的SHOW这个DIV的HTML代码如下:注意,用这个后,SHOW对象将不存在\n"   +   document.body.outerHTML);  
                      show.outerText   =   mytext.value  
                      alert("使用outertext的SHOW这个DIV的HTML代码如下:\n"   +   document.body.outerHTML);  
                      break;  
            }    
      }  
      //-->  
      </script>  
      下面为效果显示区域:  
      </body>  
      </html>  
  • 相关阅读:
    mongoDB简介
    Java中Collection和Collections的区别
    java内存模型-总结
    java内存模型-final
    java内存模型-锁
    java内存模型-volatile
    java内存模型-顺序一致性
    java内存模型-重排序
    java内存模型-基础
    FTPClient listFiles 阻塞问题
  • 原文地址:https://www.cnblogs.com/huashanlin/p/705739.html
Copyright © 2011-2022 走看看