innerHTML

[Shorty]

Can someone please explain innerHTML to me. I have looked it up, but it makes absolutely no sense to me. I mean I get it a little bit. What can you do with it. Like the .match? What can you match? What others things like that can you use?

[RedBassett]

Jun 18, 2012 13:49:00 GMT -8 Shorty said:

Can someone please explain innerHTML to me. I have looked it up, but it makes absolutely no sense to me. I mean I get it a little bit. What can you do with it. Like the .match? What can you match? What others things like that can you use?

<div><span>Hello World!</span></div>

"<span>Hello World!</span>" is the inner HTML of the div. "Hello World!" is the inner HTML of the span. It just means what is inside of an element. Can be treated like a string.

[Shorty]

How would u write that in code?

[RedBassett]

<div id="foo"><span id="bar">Hello World!</span></div>

document.getElementById('foo').innderHTML
document.getElementById('bar').innerHTML

Those are like variables, so you can read or set them.

[Shorty]

Can u do it to something that doesn't have an id?

[RedBassett]

Yes, however you will need to know how to make the selection in Javascript.

You can get an array of elements by name, select by n-th child of parent, etc.

The .innerHTML property simply is assigned to HTML DOM, so if you can select an HTML element from the DOM, then you can use that on it (assuming it has innerHTML). May get iffy on head elements and their children however.

[Shorty]

could you do the getElementByTagName

[Bennett 🚀]

document.getElementsByTagName("td") will get all the td elements,
document.getElementsByTagName("tr") will get all the tr elements. You have to use a for loop to traverse these since they return an array. Or just stick a key indicator ([#]) like document.getElementsByTagName("tr")[0]

[Shorty]

What if the indicator number isn't always certain? Say you were trying to find text in a proboards thread td, you cant always assume that the td is always the same number. what would be the method for that? or could you not?

[Bennett 🚀]

You would loop through them all, as I said previously

[Shorty]

how would you do that?

edit: would you do the for(a=0;a<(variabe for getting td);a++ {

[®i©hie]

Jun 18, 2012 15:31:27 GMT -8 Shorty said:

how would you do that?

w3schools.com/js/js_loop_for.asp

[Bennett 🚀]

Jun 18, 2012 15:31:27 GMT -8 Shorty said:

how would you do that?

edit: would you do the for(a=0;a<(variabe for getting td).length;a++ {

Indeed. a++; = a++ btw. no semi-colon at the end

[Shorty]

ahh I jsut edited my post asking if thats what you would do. okay thanks.

so it would be something like

var td = document.getElementsByTagName("tr");
for(a=0;a<td;a++) {
td.innerHTML.match(/HTML to Find/);
}

? ? ? ?

and thanks iPokemon, i didnt know that either.

[®i©hie]

Jun 18, 2012 15:37:48 GMT -8 Shorty said:

ahh I jsut edited my post asking if thats what you would do. okay thanks.

so it would be something like

var td = document.getElementsByTagName("tr");
for(a=0;a<td;a++) {
td.innerHTML.match(/HTML to Find/);
}

? ? ? ?

and thanks iPokemon, i didnt know that either.

i would name the variable tr, but something like this:

var tr = document.getElementsByTagName("tr");
for(a=0; a<tr.length; a++){
if(td.innerHTML.match(/HTML to Find/)){
EXECUTE THIS CODE HERE
}}

but i'd use the "test" method instead of match

var tr = document.getElementsByTagName("tr");
for(a=0; a<tr.length; a++){
if(/HTML to Find/.test(td.innerHTML)){
EXECUTE THIS CODE HERE
}}

Edit: you'd need to loop a number of times equal to the number of tr tags, so you'd do "tr.length", instead of just "tr"