InnerHTML outerHTML the innerText outerText usage and difference analysis


< 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>