js difference in innerHTML and innerText get content

Case are as follows:

First look at the direct effects: the largest area

 innerHTML when acquiring content, will also get to tag

 innerText time access to content, the label will filter out

<!DOCTYPE html>
<html>
    <head lang="en">
        <title></title>
    </head>
    <body>
      <div id="box">box</div>

      <!-- <div id="box">
          I p tags inside the box <p> I is a paragraph </ p>
      </div>
      <span></span>
      <a href=""></a>
      <p></p>
      lt &; P & gt; & nbsp; & Copy; -> 
        < Script > 
            var Box = document.getElementById ( ' Box ' );
             // older versions of IE supports the innerText 
            box.innerText =  '' ;
             // old version firefox support textContent 
            var A; // undefined 
            var O = {};
            console.log(o.a);//undefined

            // content between 1 acquires the tag 
            // the innerHTML and distinction innerText acquiring content 
            // the innerHTML when acquiring content, the label will also get to 
            // innerText access to content when the label will filter out 
            // console.log (box.innerText); 
            // console.log (box.innerHTML);

            // content between the tags is provided 
            // set the content when the content and if the tag, the tag will be resolved 
            // the innerHTML not standard dom properties 
            // box.innerHTML = 'O (∩ _ ∩) O ~ ha < b> programmer </ b> <p> this is a paragraph </ P> ' 
            // setting content when and if the tag, the tag will escape content 
            // first IE increased attributes, the old firefox version does not support attribute 
            // old version textContent firefox 
            // box.innerText = 'O (∩ _ ∩) O ha ~ <b> programmers </ b> <p> this is a paragraph </ p>' 
        </ Script > 
    </ body > 
</ HTML >

Guess you like

Origin www.cnblogs.com/awjbky/p/12162612.html