This took me some seriously wasted time to figure out yesterday. What I was trying to do was to create a DOM element of tag type A
and insert it into the DOM tree of my page. As I was coding along, everything was working just fine in Firefox but the damn thing wouldn't show up anywhere in IE 6. I debugged and debugged and tried all kinds of different approaches and I just couldn't work it out. Then Karl Rudd gave the right hint on the jQuery mailing list.
Basically, what I was doing was something like this:
var a = $("<a>").attr('href','#').click(somefunction);
$('#toolbar').append(a);
What was then so strange is now less surprising. When I changed the <a>
to a <span>
it actually worked but just looked wrong with the rest of the site I was working on. Here's the correct way of doing it:
var a = $("<a></a>").attr('href','#').click(somefunction);
$('#toolbar').append(a);
Notice the difference between <a>
and <a></a>
. The strange thing is that to reproduce this I created this test.html page but here I noticed that in IE 6 it won't let you add any elements that are enclosing ones that are written as singulars. That's really strange since in the same javascript as the above stuff I did a $("<div>")
which was working fine. I'll have to get back to figuring out why that one worked nad the A
one didn't.
Comments
Post your own commentHow the hell did I never know this until now? I've been coding with jQuery for almost a year now and didn't realize this until trying to debug an IE issue just this week. Thanks for the clarification.
Ever try using <a/>? Does that work?
My guess why "<div>" worked and "<a>" didn't is that "div" tags can be nested, while "a" tags cannot; while each browser may have auto-closed the tags somewhere, IE didn't like the nesting.
good
---
you saved my day!! thanks man
btw whats the thought behind hiding captcha until user tried to add a comment... :S its annoying. i'm using google chrome