?
Solved

Internet Explorer and childNodes

Posted on 2006-05-02
2
Medium Priority
?
3,074 Views
Last Modified: 2007-11-27
Does Internet Explorer support the childNodes[] function?  It doesn't seem to, or maybe it does but it interprets it differently.  Regardless, I'm have this javascript code which tries to find an <img> nested in a <div>, by using the childNodes function.  It works fine on FireFox, but IE gives me an error.

<script type = "text/javascript">
var maindiv = document.getElementById("g0");
var cNode = maindiv.childNodes[0].childNodes[1].childNodes[0].childNodes[0].childNodes[0];
document.getElementById("msgbox").value = cNode;
</script>
0
Comment
Question by:chsalvia
2 Comments
 
LVL 63

Accepted Solution

by:
Zvonko earned 500 total points
ID: 16588252
childNodes array is structured differently in Mozilla and IE because Mozilla adds #text nodes for new line breaks in the html source.
If you realy want the img objects inside another object, then try this:


<script>
var maindiv = document.getElementById("g0");
var cNode = maindiv.getElementsByTagName("img")[0]; // first image in g0 div
document.getElementById("msgbox").value = cNode; // but assigning an Image to a textbox does not make sense; perhaps: cNode.src;

</script>
0
 
LVL 29

Assisted Solution

by:Pravin Asar
Pravin Asar earned 500 total points
ID: 16588352
Here is a code which works all the times. Can find nested images upto any level.



<script language="javascript">
var imgs = new Array();
var iCnt =0;
function getImages (obj) {
     if (!obj) { return; }
     for (var ix=0; ix < obj.childNodes.length; ix++) {
          var cObj = obj.childNodes[ix];
              if (cObj.childNodes) { getImages(cObj); }
          if (!cObj.tagName) { continue; }
          if (cObj.tagName.toLowerCase().match('img')) {
               imgs[iCnt++] = cObj;
          }
     }
}
function GetImages () {
var dObj = document.getElementById('div1');
getImages(document.getElementById('div1'));
      for (ix=0; ix < imgs.length; ix++) {
            alert ('Img ['+(ix+1)+'] ' + imgs[ix].src);
      }
}
</script>
<style type="text/css">
div {
      margin: 10px;
      padding: 20px;
      border: solid;
      border-color:black;
}
</style>
<input type="button" value="Change Style" onClick="GetImages()">
<div id="div1" >
      <h3>The Click on the button to switch class</h3>
      <img name="1" src="../images/1.gif" width="100" height="100">
      <p>This is a text</p>
      <div>
            <img name="2" src="../images/2.gif" width="100" height="100">
            <div>
                  <img name="3" src="../images/3.gif" width="100" height="100">
                  <div>
                        <div>
                              <img name="5" src="../images/5.gif" width="100" height="100">
                        </div>
                  </div>
            </div>
      </div>
</div>
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question