Sobes.tech
Junior

Веб-әзірлеу контекстінде 'белгі' деген не?

sobes.tech AI

AI-дан жауап

Веб-әзірлемедегі якорь — бұл беттегі элементтің идентификаторы (HTML-атрибут id) болып табылады, ол сол немесе басқа HTML-беттегі нақты орынға сілтеме жасауға мүмкіндік береді. Мұндай сілтемеге басқанда, браузер сол якорь көрсетілген элементке дейін бетте айналдырады.

<a href="#section2">Екінші бөлімге өту</a>

<h2 id="section2">Екінші бөлім</h2>

Якорьлер URL мекенжайларын фрагменттік идентификатормен құру үшін де пайдаланылады, мысалы: https://example.com/page#section2.

id атрибутын қолмен орнатудан басқа, көптеген браузерлер тақырыптарға (<h1> - <h6>) меңзер немесе фокус болғанда автоматты түрде якорьлер құрады, бұл бөлімдерге сілтеме жасау үшін ыңғайлы.

Тиімді пайдалану сценарийлері:

  • Ұзын беттердегі навигация (бір бетке арналған қосымшалар, мақалалар).
  • Ыңғайлы мазмұн тізімін жасау.
  • Сыртқы көздерден нақты бөлімдерге тікелей сілтемелер.

Техникалық тұрғыда, браузер бұл якорьді клиент жағында өңдейді, егер сілтеме сол бетке бағытталса, серверге сұрау салмайды.

// URL-ден якорь бойынша элементті алу
const anchorId = window.location.hash.substring(1); // '#' таңбасын жоямыз

if (anchorId) {
  const targetElement = document.getElementById(anchorId);
  if (targetElement) {
    // Жұмсақ әсермен айналдыруды қолдануға болады
    targetElement.scrollIntoView({ behavior: 'smooth' });
  }
}