Jump to content

Replace Child Method Not Working


jimfog

Recommended Posts

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

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

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

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

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...