Finden Sie einen Achor in einem DIV mit JavaScript

Question

In JavaScript habe ich einen Verweis auf eine Div. In diesem Div ist ein Ankerelement mit einem Namen = 'FoundItem'

Wie bekomme ich einen Verweis auf den Anker mit dem Namen FoundItem Welches ist in der DIV, die ich habe?

Es gibt viele' FoundItem Anker in anderen Divs auf der Seite. Ich brauche 'das' divs eins.

Answer 1

Mit JQuery ist es total einfach:

<script type="text/javascript">

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

Aktualisieren:

Wenn Sie die Kontrolle über ID/Name/-Klasse in Ihrem Anker -Tag/s haben, ist es am besten, eine Klasse auf sie anzuwenden:

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

Wenn Sie mit JavaScript etwas tun, spart JQuery Ihnen jede Menge Zeit und ist es wert, die Anstrengungen zu investieren, um gut zu lernen. Beginnen mit http://api.jquery.com/browser/ Ein Intro zu dem zu bekommen, was möglich ist.

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

Verwenden Sie eine JavaScript -Bibliothek wie JQuery Und sparen Sie sich Zeit.

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

Answer 4

Sie können die GetElementsByTagName -Methode verwenden, um die Ankerelemente im DIV zu erhalten, und dann nach dem mit dem richtigen Namensattribut suchen:

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

Wenn found Ist nicht null, du hast das Element.

Wenn Sie die JQuery -Bibliothek verwenden, können Sie die Suche durchführen lassen:

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

Answer 5

Ich bin mir nicht sicher, ob dies hilft, wollte aber eine Funktion, um die Last einer Seite dynamisch zu verarbeiten und zum Anker der Wahl zu scrollen.

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

  }

}