homepage Welcome to WebmasterWorld Guest from 54.196.199.46
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Find DIV
Find a certain DIV within a HTML document
Sekka




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

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.

 

jetboy




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

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.

Sekka




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

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)

}
}

};

rharri




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

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

Rambo Tribble




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

Unless something has changed recently, I'm pretty sure only IE allows a property to be added to an element with inline markup.

Bernard Marx




msg:1476186
 10:09 pm on Jan 23, 2006 (gmt 0)

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()

Rambo Tribble




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

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."

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved