Javascript getElement von href?

Habe ich das Skript unter

var els = document.getElementsByTagName("a");
for(var i = 0, l = els.length; i < l; i++) {
  var el = els[i];
  el.innerHTML = el.innerHTML.replace(/link1/gi, 'dead link');
}

Jedoch diese durchsucht die Seite und dauert etwa 20 Sekunden, es zu tun, da es VIELE links.

Allerdings brauche ich nur, um das Ziel a's, die eine bestimmte hreffür zB. "http://domain.com/"

Also im Idealfall würde ich mag in der Lage sein, dies zu tun in einer ähnlichen Weise wie jQuery, aber ohne ein framework. So etwas wie

var els = document.getElementsByTagName("a[href='http://domain.com']");

Wie würde ich gehen über das tun dies, damit es durchsucht nur die Gegenstände mit, die passenden href?

InformationsquelleAutor der Frage Owen | 2012-05-13

  1. 41

    2016 update

    Ist es schon über 4 Jahre, da wurde diese Frage gepostet und andächtiger ganz ein bisschen.

    Du nicht verwenden:

    var els = document.getElementsByTagName("a[href='http://domain.com']");

    aber was Sie kann ist:

    var els = document.querySelectorAll("a[href='http://domain.com']");

    (Hinweis: siehe unten für die browser-Unterstützung)

    dass der code von deiner Frage arbeiten genau wie man es erwarten:

    for (var i = 0, l = els.length; i < l; i++) {
  var el = els[i];
  el.innerHTML = el.innerHTML.replace(/link1/gi, 'dead link');
}

    Können Sie sogar verwenden Sie Selektoren wie a[href^='http://domain.com'] wenn Sie möchten, dass alle links, die start mit 'http://domain.com':

    var els = document.querySelectorAll("a[href^='http://domain.com']");

for (var i = 0, l = els.length; i < l; i++) {
  var el = els[i];
  el.innerHTML = el.innerHTML.replace(/link/gi, 'dead link');
}

    Finden Sie unter: DEMO

    Browser-Unterstützung

    Browser-Unterstützung nach Kann ich die verwenden Juni 2016
    sieht ziemlich gut aus:

    Javascript getElement von href?
    (Siehe: http://caniuse.com/queryselector für die up-to-date info)

    Es gibt keine Unterstützung in IE6 und IE7 aber
    IE6 ist bereits tot
    und IE7 bald wird mit seiner 0.68% Marktanteil.

    IE8 ist über 7 Jahre alt und es teilweise unterstützt querySelectorAll - durch "teilweise" meine ich, dass Sie verwenden können, CSS 2.1-Selektoren wie [attr][attr="val"][attr~="val"][attr|="bar"] und eine kleine Teilmenge der CSS-3-Selektoren die zum Glück gehören:
    [attr^=val][attr$=val]und [attr*=val] so es scheint, dass der IE8 ist in Ordnung mit meinen Beispielen oben.

    IE9IE10 und IE11 alle Unterstützung querySelectorAll ohne Probleme, wie ChromeFirefoxSafariOper und alle anderen großen browser - sowohl desktop-und mobile.

    In anderen Worten, scheint es, dass wir sicher starten zu verwenden querySelectorAll in der Produktion.

    Mehr info

    Weitere Informationen finden Sie unter:

    Siehe auch diese Antwort für den Unterschied zwischen querySelectorAllquerySelectorqueryAll und query und Wann wurden Sie entfernt von der DOM-Spezifikation.

    InformationsquelleAutor der Antwort rsp

  2. 18

    Lesen und schreiben der innerHTML - Eigenschaft für jedes element ist wahrscheinlich ziemlich teuer, und daher verursacht die Verlangsamung - es zwingt den browser zu "serialisieren" das element, das Sie dann durch eine regexp, und dann "Deserialisieren" wieder. Schlimmer noch, du machst es für jeder a element, selbst wenn diese nicht übereinstimmen.

    Stattdessen versuchen Sie, auf der Suche direkt in die Eigenschaften der a element:

    var els = document.getElementsByTagName("a");
for (var i = 0, l = els.length; i < l; i++) {
    var el = els[i];
    if (el.href === 'http://www.example.com/') {
        el.innerHTML = "dead link";
        el.href = "#";
    }
}

    BEARBEITEN auf modernen Browsern mit viel größerer W3C-Konformität können Sie jetzt mit document.querySelectorAll() effizienter zu erhalten, einfach den links, die Sie wollen:

    var els = document.querySelectorAll('a[href^=http://www.example.com/]');
for (var i = 0, l = els.length; i < l; i++) {
    els[i].textContent = 'dead link';
    els[i].href = '#';
}

    Dies ist jedoch nicht so flexibel, wenn es mehrere domain-Namen, die Ihnen entsprechen wollen, oder zum Beispiel, wenn Sie wollen, passen beide http: und https: zur gleichen Zeit.

    InformationsquelleAutor der Antwort Alnitak

Schreibe einen Kommentar