Plugin zum Anzeigen von Ankern in einer HTML-Seite?


21

Ich bin oft auf der Suche nach einem Link, der mich mitten auf eine Webseite bringt. Oft stelle ich fest, dass die Seite die erforderlichen <a name='foo'>Tags hat, aber keine einfache Möglichkeit (z. B. ein Inhaltsverzeichnis), sie zu finden. Kennt jemand ein Plugin, das zeigt, wo / was diese Tags sind?

Ich würde Chrom brauchen, aber für andere beantwortet wäre nützlich.


FWIW: Das habe ich letztendlich benutzt:

javascript:(function(){var i,n,a;as=document.anchors;for(i=0;i<as.length;++i) {a=as[i];n=a.name;a.appendChild(document.createTextNode("#"+n));a.style.border="1px solid";;a.href="#"+n;}})();

Nehmen Sie das und setzen Sie es als Linkadresse in ein Lesezeichen.


1
Vielen Dank. Schade, dass dies nicht mit Frames oder Heading-Ankern funktioniert (es ist beispielsweise möglich, auf einem H1 zu verankern, nicht nur auf einem <A>)
rustyx

@rustyx, ich finde keine Beispiele dafür.
BCS

1
@rustyx - siehe gist.github.com/inkarkat/cd1d40996a1f818dfc71 für eine bessere Version, die H1- Anker unterstützt
Rich

Antworten:


9

Web Development Bookmarklets verfügt über ein JavaScript-Bookmarklet namens " named anchors" , mit dem an jedem <a name="">Anker Links eingefügt werden. Um das Lesezeichen zu verwenden, fügen Sie es Ihrem Favoritenmenü oder Ihrer Linkleiste hinzu. Klicken Sie dann auf einer beliebigen Seite auf das Lesezeichen "named anchors", um Links in die aktuelle Seite einzufügen. Es funktioniert jedoch nicht auf Wikipedia oder anderen Websites, die idAttribute von Tags als Anker verwenden.

Bearbeiten:
Anker anzeigen ist ein moderneres Lesezeichen, das sowohl Elemente <a name="">als auch idElemente mit einem Ankersymbol anzeigt . Das Symbol ist als data:URL in das Lesezeichen eingebettet , sodass es in älteren Browsern möglicherweise nicht funktioniert. (Der Lesezeichen-Link befindet sich ganz oben im Beitrag.)


Ich kann den zweiten nicht zum Laufen bringen.
BCS

1
Diese Version von "show anchors
Rich

1
Ich habe eine Version gemacht, die mir noch besser gefällt. Anstelle eines Ankerbildes habe ich das Lesezeichen #gefolgt von dem nameoder iddes Elements angezeigt
Lucas



0

Die Antwort von BCS wurde an die Arbeit mit Frames angepasst:

javascript:(function(){function f(e){var i,n,a;as=e.anchors;for(i=0;i<as.length;++i){a=as[i];n=a.name;a.appendChild(e.createTextNode('\u2693'+n));a.style.color='#fff';a.style.background='#666';a.style.borderRadius='5px';a.href='#'+n;}}if(window.frames.length)for(var i=0;i<window.frames.length;++i)f(window.frames[i].document);else f(document);})();
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.