Sniffy Posted November 4, 2006 Share Posted November 4, 2006 I just got into DOM and I'm having problems with my first script. Can somebody fix this for me please? <html><head><style type='text/css'>input#cool{background-color: #fff;border: 1px solid black;}</style><script type='text/javascript'>function myFunction(){document.body.getElementByID("cool").value = "Another";}</script></head><body><input type='button' id='cool' value='Button' onclick='myFunction()'></body></html> Link to comment Share on other sites More sharing options...
Sniffy Posted November 4, 2006 Author Share Posted November 4, 2006 Nevermind, I fixed it with this code. <html><head><style type='text/css'>input#cool{background-color: #fff;border: 1px solid black;}</style><script type='text/javascript'>function myFunction(){if(document.getElementById("cool").value == "Button"){document.getElementById("cool").value = "Another";}else{document.getElementById("cool").value = "Button";}}</script></head><body><input type='button' id='cool' value='Button' onclick='myFunction()'></body></html> Link to comment Share on other sites More sharing options...
donspeck Posted November 4, 2006 Share Posted November 4, 2006 If you add an onerror event handler (like in W3schools JS onerror tutorial) or use FF - Tools - Error Console it will make it easier to debug errors like that.To summerize for others the troublesome code was that the body object does not have getElementById, its the document object and the d in Id was capitalized (ALWAYS check character case) Link to comment Share on other sites More sharing options...
Sniffy Posted November 4, 2006 Author Share Posted November 4, 2006 Thanks for the advice.I had to look at a lot of online examples of the getElementById() to notify that it wasn't part of the body. Link to comment Share on other sites More sharing options...
Sniffy Posted November 4, 2006 Author Share Posted November 4, 2006 Wait, I'm having another problem with my script.I want it to display the length as well when the button is clicked but it says undefined. <html><head><style type='text/css'>input#normalButton{background-color: #fff;border: 1px solid black;}</style><script type='text/javascript'>function bunny(){var theLength = document.getElementById("somePar").length;if(document.getElementById("normalButton").value == "Make Mr.Bunny Happy."){document.getElementById("normalButton").value = "Make Mr.Bunny EVIL.";document.getElementById("somePar").innerHTML = "Mr.Bunny went to the store.";document.getElementById("parLength").innerHTML = "There are "+theLength+" character's in the Mr.Bunny sentence.";}else{document.getElementById("normalButton").value = "Make Mr.Bunny Happy.";document.getElementById("somePar").innerHTML = "Mr.Bunny went to <b>######</b>.";document.getElementById("parLength").innerHTML = "There are "+theLength+" character's in the Mr.Bunny sentence.";}}</script></head><body><input type='button' id='normalButton' value='Make Mr.Bunny Happy.' onclick='bunny()'><br /><p>Click on the button to see what happens to Mr.Bunny.</p><p id='somePar'></p><p id='parLength'></p></body></html> How can I fix this? Link to comment Share on other sites More sharing options...
Sniffy Posted November 5, 2006 Author Share Posted November 5, 2006 I also have another problem as well. I want to add strings and text to the innerHTML of an IDHere's what I tried that didn't work. var myArray = new Array("Sam","Pete");document.getElementById("someID").innerHTML += "Posted By"+myArray[0]; Is there an alternative method or am I just coding an error? Link to comment Share on other sites More sharing options...
Lulzim Posted November 5, 2006 Share Posted November 5, 2006 this one works fine: <html><head><title>test page</title><script type='text/javascript'>function addText(){ var myArray = new Array("Sam","Pete"); document.getElementById("addTextHere").innerHTML += "Posted By "+myArray[0];}</script></head><body><input type='button' value='click me' onclick="addText();"><br><br><div id='addTextHere'>InnerHTML text goes here: </div></body></html> Link to comment Share on other sites More sharing options...
Sniffy Posted November 5, 2006 Author Share Posted November 5, 2006 But tot just put as a stand alone, and not an on click function, will that work? Or would i have to put it in an onload? Link to comment Share on other sites More sharing options...
Sniffy Posted November 5, 2006 Author Share Posted November 5, 2006 Wait nevermind, I fixed the addAdmin function, but can somebody answer my other problem? Link to comment Share on other sites More sharing options...
Chocolate570 Posted November 6, 2006 Share Posted November 6, 2006 You mean the bunny function?I'm pretty sure you can't retrieve more than one element with the getElementById("") function. That's why it's getElement instead of getElements, like getElementsByTagName.That's why it's probably giving an error.Choco Link to comment Share on other sites More sharing options...
jesh Posted November 6, 2006 Share Posted November 6, 2006 The problem is with this line: var theLength = document.getElementById("somePar").length; Try this instead: var theLength = document.getElementById("somePar").innerHTML.length; You were trying to get the length of the paragraph element rather than the length of the text contained inside of it. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now