JavaScript - Getelementbyid Mix Variable With String

So I was wondering instead of calling document.getElementById('theTest').innerHTML; multiple times is it possible to store this as a variable and then access this later? If I want to change it though Have to go document.getElementById('theTest').innerHTML = something: right?

Is it even worth it to do something like this or is document.getElementById('theTest').innerHTML fast enough?

Thanks.

Hello again, I seem to be having trouble with my string variable in innerHTML.. here's my code:

Code:

function header() { // Navigation Bar
110 var o = document.getElementById("header");
111 var s = '<h3 style="float:left;">'
112 + '&nbsp; &nbsp; &nbsp;'
113 + '<a href="http://mattondo.com" class="link">MattOndo.Com</a></h3>'
114 + '<div style="float:right;">'
115 + '<div class="navbar">'
116 + '<a href="index.htm" class="nav" id="home">home</a>' //to homepage
117 + '<a href="about.htm" class="nav" id="about">about</a>' // to about page
118 + '<a href="construction.htm" class="nav" id="blog">blog</a>' // to blog page
119 + '<a href="contact.htm" class="nav" id="contact">contact</a>' // to contact page
120 + '</div>'
121 + '</div>';
122 o.innerHTML = s;

every time I run this using firebug, it says I have one error. That on line 122 variable o is null. And when I go through the code using firebug line by line, it gets to thevar o = document.getElementById("header"); and stores nothing in o, making it null. What could be my issue here??

Hey all!

Got a question I can't seem to find an answer to.

I have a little JS app that is a glorified calculator which I posted the code for below. My code uses the document object to replace the html in the "content" <div> and works great.
However, I want to add an inline style in order to change the background of the input (readonly field with an id of "coutput") based on either of the global variables named "MJPD" or "IJPD", (depending on the switch case selected in the user prompt at the beginning of the script.)

Simplified....if the value of MJPD is less than 4.6, I want the "coutput" field's background to be red, else be green.
The same goes for IJPD, except the threshold for red will be <3.83.

Code and what I have tried is below. After reading the code, look below it to see what I have tried and maybe tell me what I'm doing wrong! =)

Any help is greatly appreciated.......I have spent a week searching for this little answer and I can't seem to find it!

Code:

  
<script language="JavaScript">
var MJPD = 1;
var IJPD = 1;
function sayhello(){ //   *** live test for inline JS code placement
alert("IT WORKS!!! Now change me  =)");
}
//////////////////////////////////////////////////////
function changeScreenSize(w,h) 
{
       window.resizeTo( w,h )     
}
///////////////////////////////////////////////////
function iJPDCalc(form) //calculate IJPD value
{
var ij = parseFloat(form.IJobs.value, 10);
var it = parseFloat(form.ITime.value, 10);
var IJPD = 0;
IJPD = (ij / it) * 8.0;
form.I_JPD.value = IJPD;
}
/////////////////////////////////////////////////////
function mJPDCalc(form) //calculate MJPD value
{
var mj = parseFloat(form.MJobs.value, 10);
var mt = parseFloat(form.MTime.value, 10);
var MJPD = 0;
MJPD = (mj / mt) * 8.0;
form.M_JPD.value = MJPD;
}
/////////////////////////////////////////////////////
function ijpdcolor() //set bg color of coutput based on IJPD's value
{
if (IJPD >= 3.83) {
	return ("green");
}
else {
	return ("red");
}
}
/////////////////////////////////////////////////////
function mjpdcolor() //set bg color of coutput based on MJPD's value
{
if (MJPD >= 4.6) {
	return ("green");
}
else {
	return ("red");
}
}
/////////////////////////////////////////////////////
function startVZT3(){
var n=0;
n=prompt("What would you like to do?  1: Calculate IJPD  2: Calculate MJPD  3: Exit", "Enter a value from 1-3") 
switch(n) 
{
case(n="1"): 
document.getElementById("content").innerHTML='<FORM><h2>Combined IJPD Calculator</h2><p>Install components completed today:</p><INPUT NAME="IJobs" VALUE="3.84" MAXLENGTH="10" SIZE=10><p>Hours taken to the jobs:</p><INPUT NAME="ITime" VALUE="8" MAXLENGTH="10" SIZE=10><h4> Click the button to calculate your IJPD:</h4><INPUT NAME="calc" VALUE="Calculate" TYPE=BUTTON class="cbutton" onClick=iJPDCalc(this.form)><p>Your current combined IJPD for today is:</p> <INPUT NAME="I_JPD" class="output" style=" " id="coutput" READONLY SIZE=10></FORM>';
break
case(n="2"): 
document.getElementById("content").innerHTML='<FORM><h2>Combined MJPD Calculator</h2><p>Trouble components completed today:</p><INPUT NAME="MJobs" VALUE="4.6" MAXLENGTH="10" SIZE=10><p>Hours taken to the jobs:</p><INPUT NAME="MTime" VALUE="8" MAXLENGTH="10" SIZE=10><h4> Click the button to calculate your MJPD:</h4><INPUT NAME="calc" VALUE="Calculate" TYPE=BUTTON class="cbutton" onClick=mJPDCalc(this.form); mjpdcolor();><p>Your current combined MJPD for today is:</p> <INPUT NAME="M_JPD" class="output" style=" " id="coutput" READONLY SIZE=10></FORM>';
break
case(n="3"): 
alert('This page will now close...');
window.close();
break
default:
document.getElementById("content").innerHTML='<h1 style="padding-top: 40px; color: red;">You need to enter a value! Please try again...</h1>';
break
	}
}
///////////////////////////////////////////////////////
</script>
</head>
<body onload="changeScreenSize(825,775)">
<div id="wrapper">
<div id="sub_wrapper">

<br />
<br />

<input type="button" class="button" onclick="startVZT3()" value="Start VZT3 Web!" />
<br /><br />

<div id="content">
<h3 style="padding-top:60px;">VZT3</h3>
</div>
</div>
<script type="text/javascript"> <!-- trying script to ensure function and dynamic update of this value - doesnt work 2/3/2010 -->
document.write(mjpdcolor());
</script>

</div>
</body>

OK, so on the last line of each case statement where it injects html code into the content div, in this code style=" background: ** ** " and in between the ** ** marks, I have added such things as <script type="text/javascript">document.write(mjpdcolor())</script> (or ijpdcolor, depending on which case I am working with).

Theoretically, this should pull the value of MJPD (or IJPD), evaluate it for the if statement, then return the value of red or green and set the value of the background dynamically - but of course it doesnt. I have also tried different inline styles and even adding the css id and trying to link it to the mjpdcolor() function, but all to no avail.

Can someone help me please??

Thanks everyone, your awesome!

I am making a function where I need to know whether the input is a variable with a string value

var foo = "bar";
Function(foo)

or if it is a string, wherein it would be the name of an object

object = {
ThingsInside: function(){code}
}

Function('object')

Code:

function Function (object){
if(object is a string){
do this
}
else if (object is a variable with a string value){
do this
}
else{
do something else
}

Because they would be both passed by value, I'm not sure how or if there is a way to tell as they would both just appear as string inputs, right?

Say I had a bunch of elements with id names "id1", "id2". "id3" etc. Then say I had a function that adds a click handler such that when you click these elements it gets the id name with this.attributes[1].nodeValue;. Then say I had a bunch of arrays with the same names as the ids var id1 = ["data", false, 45]; var id2 = ["otherdata", true, 15]; var id3 = ["otherotherdata", null, 65];. How would I set a variable "currentid" to the array with the corresponding name as the id name? I guess the underlying question is, how would I convert a string to a variable name?

How can I use a string to select a variable?

E.g.
Code:

function load_menu( menu ) {
	//Availible menus
	var login = Array('Login','Register','Recovery');
	var settings = Array('Profile','Account','something');

	//Menu container ID's
	var cons = Array('menuitem1','menuitem2','menuitem3');
	
	for ( var i = 0; i < cons.length; i++ ) {
		document.getElementById(cons[i]).innerHTML =  menu[i] ;
		alert(menu[i]);
	}
}

"menu" is "login".
menu[i] should reference the "login" variable and then put one of the values for the login variable array in its place.

If you understand what I mean?
So if menu is settings then the settings array would be used.

Hi all,

I am having a hard time on this, can you help pls?
I have this code?

$("select[name=objeto"+contcheck+"]").change(function(){
$("select[name=titulo"+contcheck+"]").html('<option value="0">Carregando...</option>');

where contcheck is a counter, so a number.
It does not work at all, any help how to concatenate string and variable like this:
objeto1
objeto2
objeto3 .... and so on.

Thx.

I'm sure it's just a syntax problem. You can ignore most of this function because most of it works. The part I'm asking about is the "coordinates" variable 4th line from the bottom. The "office3" variable is a dynamically populated office number. I have the office numbers all defined as variables somewhere else but since I can't just name the variables as numbers I had to put a $ in front of them. Basically I'm trying to call the office number variable, $1656 for example. So "coordinates" is meant to be equal to "$+the chosen office number".

Problem is coordinates is coming up as literally "$1656" instead of the value of $1656. Sorry if that was confusing, can anyone point out the problem?

function display(name3,office3,officePH3,mobile3,email3)
{
var instruct="<span class='style4'><strong>"+"LOOK FOR THE FLASHING COMPASS ROSE ON THE MAP"+"</strong></span>"+"<br /><br />"+"<span class='style4'><strong>"+"HOVER ON A PRINTER TO VIEW ITS INFO OR CLICK TO MAP IT"+"</strong></span>"
var info_output="NAME: "+(name3)+"<br /><br />"+"OFFICE: "+(office3)+"<br /><br />"+"DESK PHONE: "+(officePH3)+"<br /><br />"+"MOBILE: "+(mobile3)+"<br /><br />"+"EMAIL: "+"<a href=mailto:"+(email3)+">"+(email3)+"</a>"+"<br /><br />"+(instruct)

document.getElementById("info").style.visibility="visible";
info_text.innerHTML=info_output
document.getElementById('iframe_container').style.overflow='auto'
document.getElementById('viewer').src=('Location_Files/')+(office3)+('.htm')
var coordinates='$'+(office3)

document.getElementById('compass_rose').style.top=('200')
document.getElementById('compass_rose').style.left=('200')
document.write(coordinates)
}

I am just starting to learn javascript and was hoping someone might be able to answer my question:

var months = "April Showers";

document.write('<p><img src="ad11.jpg");
document.write(" alt=");
document.write(months);
document.write(">");
document.write(months);

How come when I display my output to a browser without the presence of the
ad11.jpg file, only the first word (April) in the text string "April Showers" is dispayed where the .jpg file is suppose to be...but the last line displays the entire text string.

Hi,

I have a javascript program that currently takes the contents of a *.txt file and converts it to a string-type variable using a hidden iframe.

For my pruposes it would be much nicer to read a *.csv file instead, however the method I'm using creates the "open/save file" pop-up window.

All files are client-side and in the same folder on one computer; this is NOT server-side or internet-based. It is simply javascript used in an HTA file as programming code. The *.csv does not need to be edited, just read.

I need to know how to convert the text of this *.csv file into a string variable. I have heard of using "xmlHTTPRequest (AJAX)" but am not familiar with how to use this. Any advice or code would be greatly appreciated.

Is this possible?

Code:

String.prototype.trim = function(){
	return this.replace(/^\s+|\s+$/g, "");
}

var myStr = "  Hi what's up?  ";
myStr.trim();
alert("{" + myStr + "}"); //will result in the original string, not the trimmed version

It's possible with numbers:

Code:

var myNum = 10;
myNum++;
alert(myNum); //11

Hi All,

Am new to Javascript but fluent in C++ and other languages, I have a query, i made a global variable to hold string information, can the value of this string be assigned to a form input field value?

I mean in the 'default value sense' I am just wondering if there is any syntax to accomplish this.

EG in my javascript i have the string nameVal; It is a global variable, i would like to know if it is poosible access its value for use in the line below shown with italics, or is it basically always a case of 'type the value in manually yourself' and then rely on events functions to update the field thereafter?

Code:

Name: <br><input type = "text" name = "nameField" size = "50" value = my string val here onChange ="this.value=storeVal(this.value, '0')"></input></br>

I need to declare a variable (astString) and initialise it with a string of asterisks. astString needs to be the same length as another variable (otherString). otherString changes it value regularly so I think I need to use the .length property in some way but I can't see how!

This should be simple but it's eluding me completely.

Hey, I'm looking for a way to get a variable from a parent window in a child window. I'm aware that you can write the variable to a hidden field and then get the field's value in the child window, but I'm looking for a cleaner (all JS preferable) way of doing this.

Something like this, but I believe this is an out-dated solution:
Code:

var str = window.opener.str;
alert(str);

Any solutions?