The difference between innerhtml&innerhtml and innertext &outerhtml&innerhtml and HTML

InnerHTML

The InnerHTML property sets or returns the HTML between the start and end tags of a table row.

Syntax: Htmlelementobject.innerhtml=text

InnerHTML properties are supported for all major browsers

innerHTML in JS is bidirectional: Gets the contents of an object or inserts content into an object;

The InnerHTML property is used to set or return the HTML content between the specified labels. Grammar object.innerhtml="HTML";//Set    varhtml = object.innerhtml;//GetExample1Gets the InnerHTML (HTML content) of the paragraph P"Text/javascript">function getinnerhtml () {alert (document.getElementById ("Test"). InnerHTML); }      </script> "Test"><font color="#000"> Hi Bean Shell www.hi-docs.com</font></p> <input type="Button"onclick="getinnerhtml ()"Value="Click"/> </body> Example2set InnerHTML (HTML content) for paragraph p"Text/javascript">function setinnerhtml () {document.getElementById ("Test"). InnerHTML ="<strong> Set HTML content for tags </strong>"; }      </script> "Test"><font color="#000"> Hi Bean Shell www.hi-docs.com</font></p> <input type="Button"onclick="setinnerhtml ()"Value="Click"/> </body> 
The Document object has innerHTML and innertext two properties, both of which are the textual content of the document object, and what are the differences between the two properties? Take a look at a few examples.
" P1 ">hello World </p>          <script>              var content = document.getElementById ("  p1");              alert (content.innerhtml);              Alert (content.innertext)          </script>      </body>  
Open via IE browser with "Hello World" and "Hello World" pop-up content
Open via Firefox browser with "Hello World" and "undefined" pop-up content
Open with Chrome browser with "Hello World" and "Hello World" pop-up content
" D1 "><p id="p1">hello World </p></div>          <script>              var content = document.getElementById ("d1");              alert (content.innerhtml);              Alert (content.innertext)          </script>      </body>  
Open via IE browser, pop-up content for <p id= "P1" >hello World </p> and Hello World
Open via Firefox browser, pop-up content for <p id= "P1" >hello World </p> and undefined
Open with Chrome browser, pop-up content for <p id= "P1" >hello World </p> and Hello World
With the above two examples, you can see:
InnerHTML refers to the entire contents of the object from its starting position to the terminating position, including the HTML tag.
InnerText refers to the content from the starting position to the terminating position, but it removes the HTML tag.
At the same time, InnerHTML is supported by all browsers, and InnerText is supported by Internet Explorer and Chrome, which is not supported by Firefox browsers. In fact, InnerHTML is the property of the organization, while the InnerText property is the property of IE browser, but later the browser part implements this property.
Speaking of innerHTML, by the way, the outerHTML property is relative to innerHTML.
Keep looking at the code above and Change alert (Content.innertext) to alert (content.outerhtml)
From the browser you can see the popup box for <p id= "P1" >hello World </p>
and <divid= "D1" ><p id= "P1" >hello world</p></div>
outerHTML refers to the object label itself, in addition to the entire contents of the innerHTML.
InnerHTML is a standard-compliant attribute, and innertext only works with IE (now also in chrome), so use InnerHTML as much as possible, and less innertext, if you want to output content that doesn't contain HTML tags, You can use innerHTML to get content that contains HTML tags, and then use regular expressions to remove the HTML tags, and here's a simple example of the standard:
" D1 "><p id="p1">hello World </p></div>          <script>              var content = document.getElementById ("p1");              Alert (content.innerHTML.replace (/& lt;. +?>/gim,"));           </script>      </body>  
The pop-up is a way to get rid of the HTML tag, which is a method that can be used in all browsers.
The difference between InnerHtml () and HTML ()
In an HTML document, we can use the. html () method to get the contents of any one element. If the selector matches more than one element, only the HTML content of the first matching element is fetched.
InnerHTML is the entire contents of the object from its starting position to the terminating position, including the HTML tag
The difference between innerhtml&innerhtml and innertext &outerhtml&innerhtml and HTML