Computing.Net > Forums > Web Development > JS: getElById & innHTML prob

Computer Problems? Computing.Net has over 1,000,000 posts about all things technology related! Over 90% answered within 24 hours! Click here to start participating now! Also, be sure to check out the New User Guide.

JS: getElById & innHTML prob

Reply to Message Icon

Name: mie2com
Date: August 14, 2007 at 17:27:44 Pacific
OS: XP
CPU/Ram: 3
Product: Dell
Comment:

hi again. i was trying to sort this for about hours from my last post. with a refresh browser method, what did i miss here. this script doesn't want to write the supposed value in the assigned id.

[script]
var hpStatus = Math.floor(Math.random()*11);
if (hpStatus == 0) {
document.getElementById("myHP").innerHTML = "Low"
} else if (hpStatus < 4) {
document.getElementById("myHP").innerHTML = "Medium"
} else {
document.getElementById("myHP").innerHTML = "High"
}
[/script]

[html]
Status: [span id="myHP"] [/span]
[/html]



Sponsored Link
Ads by Google

Response Number 1
Name: mie2com
Date: August 14, 2007 at 21:42:03 Pacific
Reply:

finally, here's after hours of test n try. here's what i found which seems like rules of javascript:

1) .innerHTML must be assign to some onclick function. if u expect it writes on refresh.. let me know if u can do it.

2) playing with math.random + getelementbyid + innerhtml must be careful on where u assign the variables(global/local). compares this two examples, and u see the difference.

Example1: Not Working
<script type="text/javascript">
var randomNum = Math.floor(Math.random()*11);
function varGlobal() {
if (randomNum==0) {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "low"
} else if (randomNum<3) {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "medium"
} else {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "high"
}
}
</script>
[input type="button" value="search" onclick="varGlobal()"]
[div id="myNum"][/div]
[div id="myTxt"][/div]

Example2: Working
<script type="text/javascript">
function varLocal() {
var randomNum = Math.floor(Math.random()*11);
if (randomNum==0) {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "low"
} else if (randomNum<3) {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "medium"
} else {
document.getElementById("myNum").innerHTML = randomNum
document.getElementById("myTxt").innerHTML = "high"
}
}
</script>
[input type="button" value="search" onclick="varLocal()"]
[div id="myNum"][/div]
[div id="myTxt"][/div]

yet i have no idea for technical explanation on this. but my problem solved.


0

Response Number 2
Name: Michael J (by mjdamato)
Date: August 14, 2007 at 22:51:19 Pacific
Reply:

I didn't read through most of your 2nd post, but looking at your first post, the problem is pretty obvious. Javascript is run in-line as the page loads. There is nothing special about innerHTML that requires it to run via an onclick event.

In your example above youhave code that is trying to reference the element with the id "myHP", but since the javascript is running at the top of the page as it loads, that element does not yet exist.

I would suggest either moving the javascript after that field or put the javascript within a function and run it via the onload event. Yet another option is have the code run durin the page load, but instead of trying to set the value of innerHTLM just save the value to a variable. Then where you want the text to show, use a document.write

Michael J


0

Sponsored Link
Ads by Google
Reply to Message Icon

Related Posts

See More







Post Locked

This post is quite old and has been locked from receiving new replies. Please create a new posting instead.


Go to Web Development Forum Home


Sponsored links

Ads by Google


Results for: JS: getElById & innHTML prob

External JS file downloading... www.computing.net/answers/webdevel/external-js-file-downloading/2997.html

including .js file into jsp page www.computing.net/answers/webdevel/including-js-file-into-jsp-page-/2794.html

Finding string width using PHP/JS www.computing.net/answers/webdevel/finding-string-width-using-phpjs/1919.html