Problem accessing getElementById using javascript

I have this code and I do not know why it does not work

<html>
<head>
<title>Test</title>
<script type="text/javascript">
function StopBackgroundMusic()
{
var MusicObj = document.getElementById("BackgroundMusic");

MusicObj.data = "http://www.oreillynet.com/examples/oreilly/digitalmedia/2005/02/ableton_intro_0205_gtr.mp3";
MusicObj.autoplay = "false";
MusicObj.autostart = "false";


return MusicObj;
}
</script>
</head>
<body>


<OBJECT ID="BackgroundMusic" data="http://www.oreillynet.com/examples/oreilly/digitalmedia/2005/02/ableton_intro_0205_gtr.mp3" TYPE="audio/mpeg" height="0" width="0">
<PARAM NAME="autostart" VALUE="true">
<PARAM NAME="autoplay" VALUE="true">

</OBJECT>

<form> 


<input type='button' onclick='StopBackgroundMusic()' value='Stop music'/>

</form> 
</body>
</html>
+3
source share
2 answers

Try nullsetting the data to instead of setting the music URL again.

Another alternative is to remove the node object when you click the stop button:

function StopBackgroundMusic()
{
    var MusicObj = document.getElementById("BackgroundMusic");
    MusicObj.parentNode.removeChild(MusicObj);
}
+3
source

Is the "BackgroundMusic" element enclosed in a form element? if so try things like this

document.getElementById("[formID].BackgroundMusic");

if you use a form tag, specify its id,

<form id="music">
0
source

Source: https://habr.com/ru/post/1789814/


All Articles