outerHTML property
[This documentation is preliminary and is subject to change.]
Sets or retrieves the object and its content in HTML.
Syntax
| JavaScript | |
|---|
Property values
Type: String
content and HTML tags.
Remarks
The outerHTML property is read-only on the caption, col, colGroup, html, head, body, frameSet, tBody, td, tFoot, th, tHead, and tr objects.
The property can be any valid string containing a combination of text and tags.
When the property is set, the given string completely replaces the object, including its start and end tags. If the string contains HTML tags, the string is parsed and formatted as it is placed into the document.
You can set this property only after the onload event fires on the window. When dynamically creating a tag using TextRange, innerHTML, or outerHTML, use Microsoft JScript to create new events to handle the newly formed tags. Microsoft Visual Basic Scripting Edition (VBScript) is not supported.
You can change the value of the title element using the document.TITLE property.
To change the contents of the table, tFoot, tHead, and tr elements, use the table object model. For example, use the rowIndex property or the rows collection to retrieve a reference to a specific table row. You can add or delete rows using the insertRow and deleteRow methods. To retrieve a reference to a specific cell, use the cellIndex property or the cells collection. You can add or delete rows using the insertCell and deleteCell methods. To change the content of a particular cell, use the innerHTML property.
This property is accessible at run time as of Microsoft Internet Explorer 5. Removing elements at run time, before the closing tag has been parsed, can prevent other areas of the document from rendering.
Examples
This example uses the outerHTML property to copy an object, accompanying attributes, and children to a list when a user clicks one of the objects.
<SCRIPT>
function fnCopyHTML(){
var oWorkItem = event.srcElement;
if((oWorkItem.tagName != "UL") && (oWorkItem.tagName != "LI")){
alert("Adding " + oWorkItem.outerHTML + " to the list.");
oScratch.innerHTML += oWorkItem.outerHTML + "<BR>";
}
}
</SCRIPT>
<UL onclick = "fnCopyHTML()">
<LI><B>Bold text</B>
<LI><I>Italic text</I>
<LI><U>Underlined text</U>
<LI><STRIKE>Strikeout text</STRIKE>
</UL>
<P>
<DIV ID = "oScratch" >
</DIV>
See also
- a
- abbr
- acronym
- address
- applet
- area
- article
- aside
- b
- bdo
- big
- blockQuote
- body
- br
- button
- caption
- center
- cite
- code
- col
- colGroup
- custom
- dd
- del
- dfn
- dir
- div
- dl
- dt
- em
- embed
- fieldSet
- figcaption
- figure
- font
- footer
- form
- frame
- frameSet
- head
- header
- hgroup
- hn
- hr
- html
- i
- iframe
- img
- input type=button
- input type=checkbox
- input type=file
- input type=hidden
- input type=image
- input type=password
- input type=radio
- input type=reset
- input type=submit
- input type=text
- ins
- isIndex
- kbd
- label
- legend
- li
- listing
- map
- mark
- marquee
- menu
- nav
- nextID
- noBR
- object
- ol
- optGroup
- option
- p
- plainText
- pre
- q
- rt
- ruby
- s
- samp
- section
- select
- small
- span
- strike
- strong
- sub
- sup
- table
- tBody
- td
- textArea
- tFoot
- th
- tHead
- tr
- tt
- u
- ul
- var
- xmp
- insertAdjacentHTML
Build date: 3/8/2012
- 10/8/2009
- yecril
e.g. (recent case study)
<?xml:namespace prefix...> (e.g. original source was rtf) deep inside one <p></p> appears upon readup of any other <p>; (Also <?xml has no closure to prevent this).
e.g. (furthermore; codewrecker)
Replacement of said-same by <p> corrupts the all.tags("P") collection, stuffing-in <?xml, such that the next-item is element.outerHTML=="<?xml..." but element.tagName=="P"!
- 3/4/2009
- Mr. Raymond Kenneth Petry
- 3/17/2009
- Mr. Raymond Kenneth Petry
