Welcome to WebmasterWorld Guest from 23.20.137.66

Forum Moderators: open

Message Too Old, No Replies

Find DIV

Find a certain DIV within a HTML document

     
8:55 am on Jan 23, 2006 (gmt 0)

10+ Year Member



Hey.

I am new Javascript and I'm trying to make quite a complex thing, so bear with me.

I have assigned a property to a DIV like so,

<div id="bodytext" convertToEditor="true">
<p>Test</p>
<p>Test 2</p>
</div>

How do I get javascript to search through a HTML document for that property, and then return the ID of what it belongs to, in this case, "bodytext".

Thank you!

N.B. I need this solution for IE and Mozilla.

9:54 am on Jan 23, 2006 (gmt 0)

10+ Year Member



Long time listener, first time caller? ;)

Warning!: This hasn't been tested:

function convertorCheck() {

if (!document.getElementsByTagName) return;
arr_nodes = document.getElementsByTagName('DIV');

for (i = 0; i < arr_nodes.length; i++) {
obj_node = arr_nodes[i];
if (obj_node.getAttribute('convertToEditor') == 'true')
return obj_node.id;
}

}

1. Creates an array of all the <div>s in the document.
2. Loops through them, checking each one for the convertToEditor attribute.
3. Returns to ID of the first one it finds.

Note:

. This will ignore any further <div>s with the attribute.
. Adding custom attributes to HTML will cause it to fail validation unless you have a custom doctype.
. The document needs to be fully loaded before this function is executed (i.e. all the <div>s need to be in the browser). I suggest you attach it to an onLoad event.

11:08 am on Jan 23, 2006 (gmt 0)

10+ Year Member



Works a charm! Thank you.

Had to modify it a little bit as I may need to target multiple DIVS.

Here is my working one,

window.onload = function() {

if (!document.getElementsByTagName) {
return;
}

arr_nodes = document.getElementsByTagName('div');

for (i = 0; i < arr_nodes.length; i++) {

obj_node = arr_nodes[i];

if (obj_node.getAttribute('convertToEditor') == 'true') {

thinkeditor_load (obj_node.id)

}
}

};

1:15 pm on Jan 23, 2006 (gmt 0)

10+ Year Member



Sekka,
I believe the CSS standard is that You should only have one div per document for each ID but you can have several of the same CLASS. So you might consider using the class tag if you plan multiple divs.

rharri

4:02 pm on Jan 23, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Unless something has changed recently, I'm pretty sure only IE allows a property to be added to an element with inline markup.
10:09 pm on Jan 23, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



FF && Opera also test positive, Rambo. I've always assumed this to be the case.

The only thing is that these browsers make the distinction between attributes and JS properties (for non-conventional attributes), so these attributes can only be retrieved via

getAttribute()
3:01 am on Jan 24, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Well, how about that. Sounds like object discrimination to me, though. I'm going to have to report this to the NAAOP (National Association for the Advancement of Object Properties).

On a less serious note, I find Konqueror treats the inline property the same as one added with JS; it is available through dot notation. That's just for reference, since, say it with me, "If it works in Konqueror it likely works the same in Safari."

 

Featured Threads

Hot Threads This Week

Hot Threads This Month