InnerHTML outerHTML the innerText outerText usage and difference analysis

  • 2020-03-30 00:55:47
  • OfStack

< P> < Div id = "div" style = "background - color: # ff9966; Border: 1 px # ff0000 dashed." > < Span> This is one layer < / span> < / div>
< Input name="innerHTML" value="innerHTML" type="button" OnClick="alert(div.innerhtml);" >
< Input name="outerHTML" value="outerHTML" type="button" OnClick="alert(div.outerhtml);" >
< Input name="innerText" value="innerText" type="button" OnClick="alert(div.innertext);" >
< Input name="outerText" value="outerText" type="button" OnClick="alert(div.outertext);" >
< Script language = "javascript" >
The function changeb (obj)
{
  Obj. OuterHTML = "< Input type='text' value=' set the HTML inside the object, including the tag 'style='width:200px; '> < / input>"
}
The function changea (obj)
{
  Obj. InnerHTML = "< B> Set HTML< inside the object; / b>"
}
< / script>
< Br> < Br>
InnerHTML gets the HTML< inside the tag. Br>
OuterHTML gets the tag and the HTML< inside the tag. Br>
InnerTEXT and outerTEXT both get the text inside the tag, same thing. < Br>
< Br> < Br>
< Div id = "div1" style = "background - color: # ff9966; Border: 1 px # ff0000 dashed." > This is one layer < / div>
< Br>
< Input name="innerHTML1" value="innerHTML" type="button" OnClick="changea(div1)">
< Input name="outerHTML1" value="outerHTML" type="button" OnClick="changeb(div1)">
< Input name="innerText1" value="innerText" type="button" OnClick=" div1.innertext =' replace text with innerText '">
< Input name="outerText1" value="outerText" type="button" OnClick="div1 ".
< Br>
< P>
InnerHTML sets the HTML< inside the tag; Br>
OuterHTML setting tag and HTML< inside the tag; Br>
InnerTEXT sets the text inside the TAB < Br>
InnerTEXT sets the text inside the TAB, including the tag, to be replaced. < Br>
< / p>

InnerHTML sets or gets the HTML < inside the start and end tags of the object. Br>
OuterHTML sets or gets the HTML form of the object and its content. Br>
InnerText sets or gets the text within the start and end tags of the object. Br>
OuterText sets (including tags) or gets (not including tags) the text of the object. Br> < Br>


Related articles: