ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript を使用して HTML アンカーに移動するにはどうすればよいですか?

JavaScript を使用して HTML アンカーに移動するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-11-21 18:49:21931ブラウズ

How Can I Use JavaScript to Navigate to an HTML Anchor?

JavaScript を使用した HTML アンカーへの移動

ユーザー エクスペリエンスを向上させるために、アンカー リンクをクリックして Web ページの特定のセクションに移動することが望ましいことがよくあります。これは、jQuery などの外部ライブラリに依存しなくても、JavaScript を使用してシームレスに実現できます。

HTML 属性の活用

アンカー リンクは通常、name 属性または id 属性を使用して HTML で定義されます。

<a name="anchorName">...</a>

または

<h1>

までスクロールします。 Anchor

ページを目的のアンカーまでスクロールするには、場所オブジェクトのハッシュ プロパティを設定するだけです:

function scrollTo(hash) {
    location.hash = "#" + hash;
}

たとえば、「anchorName」という名前のアンカーに移動するには、以下のようなscrollTo()関数:

scrollTo("anchorName");

これにより、ページがシームレスにスクロールされ、表示されているページの上部近くにアンカーが表示されます。エリア

以上がJavaScript を使用して HTML アンカーに移動するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。