How to study DOM objects?

[PhotoJoe47]

I know if I use this code:

var arrTD = document.getElementByType('td')

That arrTD will have an array of "HTML DOM TableData Objects".

Now what is the best way to access each object and see what it contains. I would like see which properties each object has and what their values are. I also guess there could be some other objects within the TD object and maybe even some events and methods.

Now I have been reading an on-line reference about DOM, but I think it is a little dated.

http://www.w3schools.com/htmldom/default.asp

For example I know that a <TD> can contain class="something" but I could not find a property called class, but it did list others like id, align etc.

I would like to learn how to access and view the contents of a DOM object. Any pointers or links to good on-line tutorials or references would be very much appreciated.

Thanks

[liorean]

This is a pretty good place to start: <uri:http://www.w3.org/TR/2003/REC-DOM-Le...t-binding.html>

[PhotoJoe47]

Originally Posted by liorean

This is a pretty good place to start: http://www.w3.org/TR/2003/REC-DOM-Le...t-binding.html

Thanks for the link. I fixed in the quote

So in my example above.

var arrTD = document.getElementByType('td')

To access the <td> that had a property of class="something"

I would loop through the arrTD array search for "something" like this with "i" as the looping variable.

 
for( i = o; i < arrTD.length -1; i++)
  {
    if (arrTD[i].className == "something")
      {
         alert(arrTD[i].innerText);
      }
   }

Would this display alert message box for each <td> that had a class="something"?

[fci]

no, because you have errors:

var arrTD = document.getElementsByTagName('td')
for (var i = 0; i < arrTD.length; i++)
  {
    if (arrTD[i].className == "something")
      {
         alert(arrTD[i].innerText);
      }
   }

[PhotoJoe47]

Thanks "fci",

That was just a typo on my part I meant 0 not o. My right ring finger did not reach quite far enought. Also I don't think you are suppose to use val inside the for() function.

I have another question for the group. Where can I find an on-line reference for javascript functions that applied to DOM? For example getElementBy? In other words what are all the different thing you can get element by. I have seen quite a few by examples (Name, Type, Id) but I'm sure there are more I don't know about. Also I think there is a create element type function? I have tried doing Google search for some of the getElementBy? types but I only found examples of using just that one type. I'm sure there is an on-line reference I just don't know what to search for.

[SpirtOfGrandeur]

Originally Posted by PhotoJoe47

Thanks "fci",

That was just a typo on my part I meant 0 not o. My right ring finger did not reach quite far enought. Also I don't think you are suppose to use val inside the for() function.

Yes you sure are. It is just like using it inside a c++ or c for loop. Inside the for each line is set serperatly. and declaring a variable is always better then not declaring a variable.

DOM Elements if you search some of the other pages you should be able to find more information like you are looking for.

[mulangi]

Originally Posted by PhotoJoe47

I would like to learn how to access and view the contents of a DOM object. Any pointers or links to good on-line tutorials or references would be very much appreciated.

Thanks

I have a webpage which can be used exactly for answering this question: what DOM properties are supported by each element? Go here and click the Find out button.

Feedback on the webpage welcome.

[PhotoJoe47]

Originally Posted by SpirtOfGrandeur

Yes you sure are. It is just like using it inside a c++ or c for loop. Inside the for each line is set serperatly. and declaring a variable is always better then not declaring a variable.

DOM Elements if you search some of the other pages you should be able to find more information like you are looking for.

I guess your right, it's just that my javascript reference book shows examples without using the val. But it might be best practice to use the val keyword the first time you use the variable.

I do have one question thought, when the var is declared inside the for() statement is the scope of the variable limited to just that for loop?

Also thanks for the link to DOM Elements.

[PhotoJoe47]

Originally Posted by mulangi

I have a webpage which can be used exactly for answering this question: what DOM properties are supported by each element? Go here and click the Find out button.

Feedback on the webpage welcome.

Thanks for the link. It looks very interesting and useful.

[Pyth007]

Originally Posted by PhotoJoe47

I do have one question thought, when the var is declared inside the for() statement is the scope of the variable limited to just that for loop?

Yes... which is why it's recomended to declare your varibles in the scope that it's meant for... If you are just using the variable as a counter for the loop then its best to use for(var i...) If you want to use it after the loop finishes, declare the variable before the loop:

var i;
for(i =0...) { ... }
i+=7;
...

If you do not declare your variable with the var keyword, then the variable's scope becomes global, which means any function now has access to it!

[Kor]

in fact, the increment loop is to be set as a local variable. If a global, it is for no use. It will be always equal with the limit, or a null...

var i;
somefunction(){
for(i =0;i<somelimit;i++){
... something...
}
}

Now the i variable will be null, if the function somefunction() was not triggered, and will have the value=somelimit if that function was triggered before.

So... Why using a loop increment as global?... No use, in my opinion...

[dumpfi]

Originally Posted by Pyth007

Yes... which is why it's recomended to declare your varibles in the scope that it's meant for...

This is not true.

If you declare a variable with var it becomes local to the function in which it is declared or global, if it isn't declared within a function or if it isn't declared with var.

However, there is nothing special in declaring a variable within a loop:

function a()
{
	// declaring i inside a loop
	for(var i = 0; i < 50; ++i)
	{
		if(i == 20)
		{
			break;
		}
	}
	// accessing i outside of the loop --> will yield "20"
	alert(i);
}
a();
// accessing i outside of the function in which it is declared --> error: i is not defined
alert(i);

dumpfi