473,231 Members | 1,713 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,231 software developers and data experts.

innerHTML problem in Safari

I have a fairly complicated application written in Javascript+DOM, and
I've run into an odd problem that only shows up in Safari. Basically,
after setting innerHTML of a DIV, the div ends up empty instead of with
the correct content. In fact, the children of the DIV all vanish, and
it becomes impossible to set the contents thereafter.

The much simplified scenario:

<div id='divname'>
hello
</div>

var divReference = document.getElementById('divname');
divReference.innerHTML = 'loo loo loo';
alert(divReference.innerHTML);

At this point the laert box is empty. Also, when I iterate through the
properties of the divReference, they are quite messed up. For example,
firstChild and lastChild are null. Also, some properties are
duplicated.

Has anybody run into this? Unfortunately I have been unable to
reproduce in a simple test app, it seems to only happen in my
complicated app.

Also, please don't advise me to use DOM instead of innerHTML. I know
DOM is more elegant and correct, unfortunately it would be very
complicated given the amount of content I want to be pushing around.

Thanks,
Garth

May 16 '06 #1
7 9270
just at a quick first glance. i see you've single-quoted your div's
id. id='divname'. have you tried double quoting in your actual code?
some browsers can be super picky about those things.

May 16 '06 #2
Thanks for the suggestion. I wasn't aware that there was any difference
between ' and " in HTML. However, switching to double quotes didn't
make any difference.

Garth

May 16 '06 #3
one more thought, just a shot in the dark- in your much more complex
app, i'm guessing that you're using innerHTML to dump a lot of HTML
into that div tag. have you made sure that String of HTML is valid?
often times when i write big long Strings of HTML and stick them in a
div using innerHTML, i find that i've messed up a set of quotes
somewhere or haven't closed a tag properly.

May 16 '06 #4
Yup, I'd thought of that. When I found the point where it failed (as
shown in previous message) I changed the complex HTML string to a
simple text only string. It still failed.

May 16 '06 #5
"Walton" <jr******@gmail.com> writes:
just at a quick first glance. i see you've single-quoted your div's
id. id='divname'. have you tried double quoting in your actual code?
some browsers can be super picky about those things.


They shouldn't. Either way of quoting attributes has been valid since
the first versions of HTML. It should not make a difference.
(Ofcourse, if the attribute value contains an apostrophe, you'll
either have to quote it or use double quotes, e.g.,
title="it's fun"
or
title='it&apos;s fun"
and failing to do that would make the browser "picky", and rightly so)

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
May 16 '06 #6
ga*********@gmail.com wrote:
I have a fairly complicated application written in Javascript+DOM, and
I've run into an odd problem that only shows up in Safari. Basically,
after setting innerHTML of a DIV, the div ends up empty instead of with
the correct content. In fact, the children of the DIV all vanish, and
it becomes impossible to set the contents thereafter.
There is a bug reported at quirksmode regarding innerHTML in XHTML pages:

<URL:http://www.quirksmode.org/bugreports/archives/2004/11/innerhtml_in_xh.html>

I don't know whether that covers your scenario or not.

The much simplified scenario:

<div id='divname'>
hello
</div>

var divReference = document.getElementById('divname');
divReference.innerHTML = 'loo loo loo';
alert(divReference.innerHTML);

At this point the laert box is empty. Also, when I iterate through the
properties of the divReference, they are quite messed up. For example,
firstChild and lastChild are null. Also, some properties are
duplicated.

Has anybody run into this? Unfortunately I have been unable to
reproduce in a simple test app, it seems to only happen in my
complicated app.
That would indicate that there are possibly errors in the HTML you are
inserting, the differences between browsers in the generated DOM may be
the result of error correction.

Post a link to a page that shows the error, or try validating the HTML
you are trying to insert.

Also, please don't advise me to use DOM instead of innerHTML. I know
DOM is more elegant and correct, unfortunately it would be very
complicated given the amount of content I want to be pushing around.


There is no public standard for innerHTML, so you can't depend on it
being implemented consistently. It generally works OK where the HTML is
generated elsewhere then inserted, but if you are trying to read the DOM
using innerHTML then insert it back in again, results will vary between
browsers.
--
Rob
Group FAQ: <URL:http://www.jibbering.com/faq/>
May 16 '06 #7
ASM
ga*********@gmail.com a écrit :

Also, please don't advise me to use DOM instead of innerHTML. I know
DOM is more elegant and correct, unfortunately it would be very
complicated given the amount of content I want to be pushing around.


unfortunatly Safari (and probably Firefox) using innerHTML for complex
code (elements with events, datas comming from text-field ...) loose
quite a bit of important infos ...

innerHTML would be only used for some text, no more.

but, perhaps in your innerHTML you have closing tags ?
and, of course you use '<\/tag>' insteed of '</tag>' ?

--
Stephane Moriaux et son [moins] vieux Mac
May 17 '06 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: rob | last post by:
I know IE first supported it, and Mozilla supports it, what about Opera and Safari? IE 5 on the mac does, right? many thanks
11
by: kaeli | last post by:
Hey all, AFAIR, innerHTML started as MS proprietary, but Mozilla implemented it as well. Does anyone know if any other browsers support it? It is not in the W3C DOM, is it? A quick GIS seemed to...
7
by: KK | last post by:
Please help! I am currently experiencing a bug in Safari v125.9. When I modify the value of form input box and then get the innerHTML property of the surrounding div object - I am returned the...
3
by: mtz | last post by:
Hi there, It looks like safari has a problem with innerHTML. I have to change a dropdown depending on a selection in another dropdown. When I change the selection in the first dropdown the...
4
by: RobG | last post by:
I know you aren't supposed to use innerHTML to mess with table structure, but it seems you can't use it just after a table without damaging the containing element. I added a table to a div using...
10
by: Jake Barnes | last post by:
This weekend I wanted to learn AJAX, so I set up a little toy page where I could experiment. The idea of this page is that you click in one of the boxes to get some controls, at which point you can...
2
by: xhe | last post by:
I met a very headache problem in javascript, I think this might be difference between IE and NS / Safari. I have a text area <form> <textarea name='tex1' onkeyup='displayit();'></textarea>...
1
Dmitry Khudorozhkov
by: Dmitry Khudorozhkov | last post by:
Hi everyone! I have a html page with an IFrame; and the following code: var doc = document.getElementById("iframe_id").contentDocument; doc.body.innerHTML = htmlCode; This code is run in...
6
by: PaPa | last post by:
I'm not sure this is a javascript issue or an HTML issue. I notice that when I extract the contents of a div using the innerHTML property (?), that I wind up with a literal variable (?) which...
0
by: VivesProcSPL | last post by:
Obviously, one of the original purposes of SQL is to make data query processing easy. The language uses many English-like terms and syntax in an effort to make it easy to learn, particularly for...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: jianzs | last post by:
Introduction Cloud-native applications are conventionally identified as those designed and nurtured on cloud infrastructure. Such applications, rooted in cloud technologies, skillfully benefit from...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.