Problem in changing flash (swf) file location in embed or param tag using JavaScript

Manipulating the DOM (Document Object Model) using JavaScirpt is known to all. Changing the src attribute of the img (Image tag) tag using JavaScript is very common. But I had a problem in changing the flash (swf) file location in embed or param tag using JavaScript. I had following html code for my flash creative:

<div id="bannerCode">
	<object width="422" height="62"
	classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
	codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0">
		<param name="movie"
			value="//www.viralpatel.net/bannerImages/f9039149_3.swf" />
		<param name="quality" value="high" />
		<embed width="422" height="62"
			src="//www.viralpatel.net/bannerImages/f9039149_3.swf" quality="high"
			type="application/x-shockwave-flash"
			pluginspace="http://www.macromedia.com/go/getflashplayer" />
	</object>
</div>
Code language: HTML, XML (xml)

First I tried to change the src attribute of the embed tag and value attribute of the param tag (with name=”movie”). type using following JavaScript.

objDiv = document.getElementById("bannerCode"); //this will return the "object" of the div tag containing the flash code
objDiv = arrTagObject = objDiv.getElementsByTagName("object"); //gives array of all the object tag inside the "bannerCode" div which containing the flash code
for(i=0 ; i<arrTagObject.length;i++)
{
        arrTabObject[i].width = new_width;
        arrTabObject[i].height = new_height;
        arrTagParam = arrTagObject[i].getElementsByTagName("param"); //this will return the "param" of the div tag containing the flash code
        for(j=0;j<arrTagParam.length;j++)
        {
                if("movie" == arrTagParam[j].name)
                {
                        arrTagParam[j].value = new_flash_location; // set the new location for the flash (swf) movie
                }
        }
}
arrTagEmbed = objDiv.getElementsByTagName("embed");
arrTagEmbed[0].width = new_width;
arrTagEmbed[0].height = new_height;
arrTagEmbed[0].src = new_flash_location;
[/code]
But the above code didn't work, neither in <strong>Firefox</strong> nor in <strong>IE6</strong> (<strong>Internet Explorer 6</strong>). Even I checked in <strong>FireBug</strong> (the <strong>FireFox plugin</strong> to see the <strong>DOM-Document Object Model</strong>). In firebug all the attributes like height width and src of embed, all were set to new value but still the old <strong>Flash</strong> (<strong>swf</strong>) movie was displayed.

Changing the <strong>src (source) attribute</strong> of the embed tag won’t render the new <strong>flash (swf)</strong> movie. You need to put the <strong>div tag</strong> around your flash object or embed code and do replace the <strong>innerHTML of the div tag</strong> using the document.getElementById("divTagId").innerHTML = new_flash_code.

Following code works for me.
<!-- wp:code {"language": "javascript"} --><pre class="wp-block-code"><code></code></pre><!-- /wp:code -->
str1 =str1 += "\" height=\"" + new_height;
str1 += "\"codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0\"
classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\"><param value=\"";
str1 += new_flash_location + "\" name=\"movie\"/><param value=\"high\" name=\"quality\"/><embed width=\"";
str1 += new_width + "\" height=\"";
str1 += new_height + "\"pluginspace=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" quality=\"high\" src=\"";
str1 += new_flash_location + "\"/></object>";
document.getElementById("bannerCode").innerHTML = str1;
Code language: JavaScript (javascript)