jimfog Posted November 4, 2011 Share Posted November 4, 2011 Here is a replace child code: function replace (){var newnode=document.createElement("div").appendChild(document.createTextNode("Hi"));var oldnode=document.getElementsByClassName("testMenuItem1")[0];var parent=document.getElementById("testmenu");parent.replaceChild(newnode,oldnode);}; The above code does not work and i cannot figure why, the above function is a callback function to a jQuery slidetoggle effect: ).slideToggle("slow",replace()); I have not written all of the code but only the portion that is relevant to the callback just for the sake of clarity. And here is there code where the node resides i want to replace: <div id="testMenu"><div id="days">next day</div> [b]<a style="display:block;" class="testMenuItem1" title="08:00" name="1">08:00</a>[/b] What can you make from the above? Link to comment Share on other sites More sharing options...
dsonesuk Posted November 4, 2011 Share Posted November 4, 2011 var parent=document.getElementById("testmenu"); should be var parent=document.getElementById("testMenu"); Link to comment Share on other sites More sharing options...
dsonesuk Posted November 4, 2011 Share Posted November 4, 2011 I think you are going to have a problem using .getElementsByClassName in IE, would be better to use jquery instead All Jquery method for ALL browsersfunction replace (){$(".testMenuItem1").eq(0).replaceWith("<div>Hi</div>")}; The Non Jquery Method that you would have to use for ALL Browsers To get it to work in both IE and other browsers you would have to use code similar to function replace (){var newnode=document.createElement("div");var newtextnode = document.createTextNode("Hi"); var parent=document.getElementById("testMenu");var oldnode = parent.getElementsByTagName("A"); anc_class_count=0;anc_class_index_arr=new Array();for(i=0;i<oldnode.length;i++) { if(oldnode[i].className=="testMenuItem1") { anc_class_index_arr[anc_class_count]=i; anc_class_count++; }}if(anc_class_index_arr.length>0) { parent.replaceChild(newnode,oldnode[anc_class_index_arr[0]]); newnode.appendChild(newtextnode); }}; Big difference, and all because of IE Link to comment Share on other sites More sharing options...
jimfog Posted November 5, 2011 Author Share Posted November 5, 2011 Oops, did not notice that had a letter wrong-in programming mistakes like these are often, it needs a lot of caution. 1 question. With the jQuery code you are demonstrating, can i target all browsers, including IE? Or i must use both the jQuery code and the code you write below? Link to comment Share on other sites More sharing options...
dsonesuk Posted November 5, 2011 Share Posted November 5, 2011 Oops, did not notice that had a letter wrong-in programming mistakes like these are often, it needs a lot of caution. 1 question. With the jQuery code you are demonstrating, can i target all browsers, including IE? Or i must use both the jQuery code and the code you write below? Yes! the jquery code provided will work in all browsers, that's what so good about jquery, its cross browser compatible, all the referencing of class names for example, is done in such a way so you don't have to worry about providing a specific code for a class reference for crappy IE, it all done for you, you just reference the class as set out by Jquery, and that's it done!. the 1st line of jquery code does exactly the same as what you have to do to make it work in all browsers with the non jquery javascript below it. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.