I have to use a picture, Stackoverflow says:
Oops! Your question couldn't be submitted because:
Your post appears to contain code that is not properly formatted as code. Please indent all code by 4 spaces using the code toolbar button or the CTRL+K keyboard shortcut. For more editing help, click the [?] toolbar icon.
The screenshot was taken from Stackoverflow's form.
Internet Explorer has no problems with the length property. If it didn't support it, then it would report undefined not 0.
The HTML is invalid, there is no name attribute for the div element. Internet Explorer is just error recovering in a different way to Firefox and not matching the div elements with getElementsByName
Elements that support both the NAME attribute and the ID attribute are included in the collection returned by the getElementsByName method, but elements with a NAME expando are not included in the collection.
— MSDN getElementsByNameMethod
Use a class instead. Internet Explorer 8 doesn't have a native getElementsByClassName, but there are no shortage of cross-browser implementations or you could use a selector engine or a big library that includes one such as YUI or jQuery.
getElementsByName is for use on input HTML elements - DIV elements do not have name attributes
Your problem is not that .length is not working on IE, but that getElementByName() is not working on IE... : getElementsByName in IE7
Related
I am using this:
document.getElementById("div").getElementsByClassName("class");
The above seems to work in Chrome and FireFox, but not in IE8.
I am using
document.getElementById("branch").getElementsByClassName("branch.address");
Above one fetches one row but using this
document.getElementById("branch").querySelectorAll("branch.address");
fetched empty
How do I make this work in IE8?
The problem isn't getElementById, it's getElementsByClassName — IE8 doesn't have that.
Instead, you can use querySelectorAll, which is on all modern browsers, and also IE8:
document.getElementById("div").querySelectorAll(".class");
Or all in one:
document.querySelectorAll("#div .class");
querySelectorAll accepts any CSS selector, and returns a list of matching elements. There's also querySelector, which accepts any CSS selector, and returns the first matching element (or null if none match).
IE8 does not support getElementsByClassName(). See this post for more details. Also see the link posted here for a SO post with work-arounds.
chrome supports the isContentEditable property (lists it in the "Inspect Element"), but reports false for INPUT, FORM - actually, everything.
too me, for example, seems that INPUT, non-readonly, should be true.
does anybody know what's going on?
isContentEditable doesn't have anything to do with forms and input boxes.
It was designed to be a way to flag inline editable html content.
You can see a working example here: http://www.navioo.com/javascript/dhtml/isContentEditable_Example_4513.html
You can read about it
here: http://www.w3.org/TR/2009/WD-html5-20090423/editing.html
or: http://blog.whatwg.org/the-road-to-html-5-contenteditable
An element's isContentEditable property, in browsers which support it, tells you whether the immediate child content of the element is editable. It applies specifically to regular non-interactive content (i.e. not form controls), which can be made editable using the contenteditable attribute:
<div contenteditable="true">This text is all <i>editable</i></div>
The isContentEditable property of both the <div> and the <i> elements above will report true. However, be aware that not every browser that supports contentEditable also supports isContentEditable: Firefox 3.x, for example, supports contentEditable but not isContentEditable.
contenteditable is standardized in HTML5 but has been around for over a decade. It was first introduced in IE 5.5 in 2000 and eventually made its way into other browsers several years later. Firefox has had it since version 3.0 (although it had the document-wide equivalent designMode since pre-1.0) and Safari since (I think) 2.0.
Here's a good summary of the history of contentEditable: http://blog.whatwg.org/the-road-to-html-5-contenteditable
How can I find an id based on its class just using javascript. I know this is easy with jQuery what is the solution.. using getElementsByTagName ?
document.getElementsByClassName('myClassName')[0].id
or
document.querySelector('.myClassName').id
First step would be find the element(s) with the given class name. There are currently some functions supported by modern browsers like getElementsByClassName and querySelector functions. but they are not cross browser solutions.
That is, getElementsByClassName is not supported by IE 6-8 and querySelector is not supported by IE6-7 & FF3
source: http://www.quirksmode.org/dom/w3c_core.html
Therefore if you are not supporting these browsers then you can use them else you would need a wrapper js function like one mentioned in this blog post originally found on justswell.org.
I am passing a string containing HTML tags (center, ul, etc) to a function which then places it in a div, span or p innerHTML. This works great in all browsers but IE, which displays nothing. I tracked the problem the the tags, because plain text does display in IE.
I am using IE 9.
The code is a little long for posting, but here is the idea:
str='<center>Some text</center>';
displayText('divId',str);
function displayText(id,str)
{ document.getElementById(id).innerHTML=str; }
Sorry everyone. I found that I could not set the innerHTML of a [P] element. I changed it to a [span] and it worked.
innerHTML is not a good idea (or needs a workaround) for <table>, <select>, <p> elements. This is a known limitation in older versions IE.
Also see this question IE innerHTML error.
Glad that you found a solution..
You should consider using jquery. Then you don't have to worry about all the cross browser implementations & instead focus on adding/enhancing functionality & user experience on your site/application.
I have this problem of an image rollover javascript not working in Internet Explorer if I don't specify the NAME attribute in the tag. The other problem is when I do, the HTML5 validator will come up with a message saying "NAME attr is obsolete, use ID instead" which is what I am using with getElementById.
Should I specify a NAME attribute anyway and ignore the error messages or is there a workaround? I don't wish to add extra attributes if I don't have too.
Thanks
Adam
You aren't calling getElementById; you're writing document[img_name].
Don't.
Check to make sure you do not have duplicate ids. getElementById incorrectly gets name="" in certain IEs, if there is no element with the id.
Also, make sure the document is not in quirks mode and is in standards mode. alert( document.compatMode ) and make sure it isnt BackCompat. If it is, use a proper doctype and kill comments/whitespace before doctype.