FAQ Topic - How do I modify the current page in a browser? (2008-04-30)

[FAQ server]

-----------------------------------------------------------------------
FAQ Topic - How do I modify the current page in a browser?
-----------------------------------------------------------------------

Using the DOM the non-standard but widely implemented innerHTML
extension, the following would be sufficient to modify the content
of any element that can have content:
` <div id="anID">Some Content</div> ` with script of
` document.getElementById("anID").innerHTML=
"Some <em>new</em> Content"; `
Where "anID" is the (unique on the HTML page) ID attribute value
of the element to modify.

The script below adds support for ` document.all ` capable browsers.
Support for NN4 is also possible, but certain issues mean that
it is not listed here. Using the example above, the call would
be written:
` DynWrite('anID',"Some <em>new</em> Content") `
With the below code also in the page:

DocDom = (document.getElementById?true:false);
DocAll = (document.all?true:false);
DocStr=''
if (DocAll) DocStr="return document.all[id]"
if (DocDom) DocStr="return document.getElementById(id)"
GetRef=new Function("id", DocStr)
if (DocStr=='') { DynWrite=new Function("return false") } else {
DynWrite=new Function("id", "S", "GetRef(id).innerHTML=S; return true")
}

An alternative DynWrite function:

http://www.jibbering.com/faq/faq_notes/alt_dynwrite.html

http://msdn2.microsoft.com/en-us/library/ms533897.aspx

http://developer.mozilla.org/en/docs/DOM:element.innerHTML


--
Postings such as this are automatically sent once a day. Their
goal is to answer repeated questions, and to offer the content to
the community for continuous evaluation/improvement. The complete
comp.lang.javascript FAQ is at http://jibbering.com/faq/index.html.
The FAQ workers are a group of volunteers. The sendings of these
daily posts are proficiently hosted by http://www.pair.com.

 

[Dr J R Stockton]

In comp.lang.javascript message <[email protected].

FAQ Topic - How do I modify the current page in a browser?

It appears that

function Wryt(ID, S) { document.getElementById(ID).innerHTML = S }

can be used, instead of the code in the current answer, with all current
browsers; and that, if getElementById is not natively present, then

if (document.all && !document.getElementById) {
document.getElementById = function(id) {
return document.all[id] } }

will provide a version adequate for this purpose. To avoid declaring a
non-standard global function, one might use (needs test) something like

function Wryt(ID, S) { with (document)
( getElementById ? getElementById(ID) : all[ID] ).innerHTML = S }

instead.

OTOH, IIRC, it has been stated that it is better to use newer DOM
methods rather than innerHTML. If someone were to suggest suitable
tested code, perhaps the FAQ entry might get changed?