Trova un'ancora in un Div con javascript

Question

In javascript ho un riferimento a un div. In quel div c'è un elemento di ancoraggio con un nome = ' foundItem '

Come posso ottenere un riferimento all'ancora con il nome foundItem che si trova nella Div di cui ho il riferimento?

Ci sono 'molti' foundItem ancore in altri div sulla pagina. Ho bisogno di questo "DIV".

Answer 1

Usando jquery, è semplicissimo:

<script type="text/javascript">

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

Aggiornamento:

Come da commenti, se hai il controllo su cosa identificare / nominare / classificare i tuoi tag anchor, sarebbe meglio applicare una classe a loro:

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

Se stai facendo qualcosa con javascript, jQuery ti fa risparmiare un sacco di tempo e vale la pena investire lo sforzo per imparare bene. Inizia con http://api.jquery.com/browser/ per avere un'idea di ciò che è possibile .

Answer 2

// 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]');

Answer 3

Utilizza una libreria JavaScript come jQuery e risparmia tempo.

var theAnchor = $('#divId a[name=foundItem]');

Answer 4

È possibile utilizzare il metodo getElementsByTagName per ottenere gli elementi di ancoraggio nel div, quindi cercare quello con l'attributo nome corretto:

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;
  }
}

Se found non è null, hai l'elemento.

Se ti capita di usare la libreria jQuery, puoi lasciargli fare la ricerca:

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

Answer 5

Non sono sicuro se questo aiuta, ma volevo una funzione per gestire dinamicamente il caricamento di una pagina e scorrere fino all'ancoraggio di scelta.

function scrollToAnchor(anchor_val) {

  alert("" + anchor_val);

  var page = document.getElementById('tables');
  var found = null;
  var cnt = 0;
  var e = document.getElementsByTagName('a');

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

    if (e[i].name && e[i].name == anchor_val) {

      found = e[i];

      break;

    }

    cnt++;

  }

  if (found) {

    var nPos = found.offsetTop;

    alert("" + nPos);

    page.scrollBy(0, nPos);

  } else {

    alert('Failed with call of scrollToAnchor()' + cnt);

  }

}