Does your browser evaluate the Javascript of innerHTML?

While playing with some really slick asynchronous javascript stuff (no - not Ajax, there wasn't any XML involved), I ran into an odd behavior that varied between the several browsers.

What I'm doing is passing back a table from an asynchronous call and placing it into a premade table elementId. The page supports interaction with either javascript, if enabled, or straight href links if javascript is not enabled.

The problem occurs when my Async call returns a table with a

Replace innerHTML with innerText and Safari renders the entire script source, Firefox & Camino ignore it.

Hrm - so how to dynamically fill in script into the DOM of a page and have it executed?

The DOM inspector in Firefox correctly shows the Javascript being part of the element, but since the parser has already gone through that element, evaluated the Javascript later in the page, then it doesn't seem to be re-executed.

It seems as though there is promise in the eval function of Javascript. However, nothing seems apparent yet.

About this article

written on
posted in ProgrammingWebJavascript Back to Top

About the Author

Andrew Turner is an advocate of open standards and open data. He is actively involved in many organizations developing and supporting open standards, including OpenStreetMap, Open Geospatial Consortium, Open Web Foundation, OSGeo, and the World Wide Web Consortium. He co-founded CrisisCommons, a community of volunteers that, in coordination with government agencies and disaster response groups, build technology tools to help people in need during and after a crisis such as an earthquake, tsunami, tornado, hurricane, flood, or wildfire.