views:

179

answers:

4

In javascript I have a reference to a div. In that div is an anchor element with a name='foundItem'

How do I get a reference to the anchor with the name foundItem which is in the Div I have the reference of?

There are 'many' foundItem anchors in other divs on the page. I need 'this' DIVs one.

It's for the web site http://BiblePro.BibleOcean.com

+1  A: 

Using jquery, it's dead easy:

<script type="text/javascript">

$(function(){    
    var item = $("#yourDivId a[name=foundItem]")
)};
</script>

Update:

As per the comments, if you have control over what to id/name/class your anchor tag/s, it would be best to apply a class to them:

<div id="firstDiv">
    <a href="someurl.htm" class="foundItem">test</a>
</div>
<div id="secondDiv">
    <a href="someOtherUrl.htm" class="foundItem">test another one</a>
</div>
<!-- and so forth -->

<script type="text/javascript">

$(function(){    
    var item = $("#firstDiv a.foundItem");
    alert(item.html()); // Will result in "test"

    var item2 = $("#secondDiv a.foundItem");
    alert(item2.html()); // Will show "test another one"

)};
</script>

If you're doing anything with javascript, jQuery saves you tons of time and is worth investing the effort to learn well. Start with http://api.jquery.com/browser/ to get an intro to what's possible.

Ted
so if I changed the anchor to an id of foundItem and used jQuery I could use:var item = $("#yourDivId a.foundItem");yes?
BahaiResearch.com
Yes, or you could just use `$('foundItem')`, or without jquery just use `document.getElementById('foundItem')`
Rob
Yes, but as Rob says, at that point you would just get by the Id directly. Having said that, you don't want more than one element with the same Id (or name for that matter. If you have control over what to do with your anchor tag, then just apply a class to it...as the commenting syntax is limited, I'll edit the answer above.
Ted
Oh - just noticed you used the class designation in var item = $("#yourDivId a.foundItem"); That wouldn't work if you change the ID. You'd want var item = $("#yourDivId a#foundItem");
Ted
Thanks ovalsquare, that worked great. I am now officially stunned by jQuery. wow....
BahaiResearch.com
+1  A: 

Use a JavaScript library like jQuery and save yourself time.

var theAnchor = $('#divId a[name=foundItem]');
James Skidmore
+1  A: 
// assuming you're not using jquery or mootools 
// assume div is mydiv
var lst = mydiv.getElementsByTagName('a');
var myanchor;
for(var i=0; i<lst.length; ++i) {
    if(lst[i].name && lst[i].name == 'foundItem') {
     myanchor = lst[i];
     break;
    }
}


// the mootools method
var myanchor = $(mydiv).getElement('a[name=foundItem]');
Rob
Breaks if there is an anchor without a name attribute...
Guffa
nice catch, fixed
Rob
A: 

You can use the getElementsByTagName method to get the anchor elements in the div, then look for the one with the correct name attribute:

var found = null;
var e = divReference.getElementsByTagName('A');
for (var i=0; i < e.length; i++) {
  if (e[i].name && e[i].name == 'foundItem') {
    found = e[i];
    break;
  }
}

If found is not null, you got the element.

If you happen to use the jQuery library, you can let it do the searching:

var found = null;
var e = $(divReference).find('a[name=foundItem]');
if (e.length == 1) found = e.get(0);
Guffa