ปลั๊กอินที่จะแสดงจุดยึดในหน้า HTML?


21

ฉันมักจะพบว่าตัวเองกำลังมองหาลิงค์ที่จะทำให้ฉันอยู่ตรงกลางของหน้าเว็บ บ่อยครั้งที่ฉันพบว่าหน้านั้นมี<a name='foo'>แท็กที่จำเป็นแต่ไม่มีวิธีง่ายๆ (เช่นสารบัญ) ในการค้นหา ไม่มีใครรู้ว่าของปลั๊กอินที่แสดงที่ไหน / แท็กเหล่านั้นคืออะไร?

ฉันต้องการโครเมี่ยม แต่คำตอบสำหรับคนอื่นจะมีประโยชน์


FWIW: นี่คือสิ่งที่ฉันใช้:

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

รับสิ่งนั้นและใส่เป็นที่อยู่ลิงก์ในบุ๊คมาร์ค


1
ขอบคุณ น่าเสียดายที่นี่ดูเหมือนจะไม่ทำงานกับเฟรมหรือส่วนหัวของเบรก (เป็นไปได้ที่จะยึดติดกับ H1 เช่นไม่ใช่แค่ <A>)
rustyx

@rustyx ฉันไม่พบตัวอย่างของวิธีการทำ
BCS

1
@rustyx - ดูgist.github.com/inkarkat/cd1d40996a1f818dfc71สำหรับรุ่นที่ดีกว่าซึ่งรองรับตัวยึด h1
Rich

คำตอบ:


9

การพัฒนาเว็บ Bookmarkletsมี bookmarklet JavaScript เรียกว่าanchors ชื่อที่จะแทรกลิงค์ที่แต่ละ<a name="">จุดยึด ในการใช้ bookmarklet ให้เพิ่มเข้าไปในเมนูรายการโปรดหรือแถบลิงก์ จากนั้นในหน้าใด ๆ ให้คลิกที่บุ๊คมาร์ค "named anchors" เพื่อแทรกลิงก์ในหน้าปัจจุบัน อย่างไรก็ตามมันไม่สามารถใช้ได้กับ Wikipedia หรือเว็บไซต์อื่น ๆ ที่ใช้idคุณลักษณะของแท็กเป็นจุดยึด

แก้ไข:
Show Anchorsเป็น bookmarklet ที่ทันสมัยกว่าซึ่งแสดงทั้งองค์ประกอบ<a name="">และidองค์ประกอบด้วยไอคอนจุดยึด ไอคอนถูกฝังใน bookmarklet เป็นdata:URL ดังนั้นจึงอาจไม่ทำงานในเบราว์เซอร์รุ่นเก่า (ลิงก์ bookmarklet อยู่ด้านบนสุดของโพสต์)


ฉันไม่สามารถทำงานที่สองได้
BCS

1
"แองเคอร์โชว์" รุ่นนี้ได้รับการปรับปรุงจากบล็อกโพสต์นั้น: gist.github.com/inkarkat/cd1d40996a1f818dfc71
Rich

1
ฉันทำเวอร์ชันที่ฉันชอบยิ่งขึ้น แทนที่จะเป็นรูปสมอเรือฉันสร้างหน้าจอบุ๊คมาร์ค#แล้วตามด้วยnameหรือidองค์ประกอบ: gist.github.com/LucasLarson/d5bd0881d8eb99d9fb254d28e7a315c4
Lucas



0

คำตอบของ BCS ปรับให้เข้ากับเฟรม:

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);})();
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.