JavaScript href 表示式

Shiv Yadav 2023年1月30日 2022年5月10日
  1. JavaScript href 表示式
  2. 在 JavaScript 中使用帶有雜湊的 href 表示式
  3. 在 JavaScript 中將 href 表示式與函式一起使用
JavaScript href 表示式

本文將幫助你瞭解 href 表示式及其在 JavaScript 中的工作機制。

JavaScript href 表示式

HTML 元素(或錨元素)上的 href 屬性生成指向網頁、檔案、電子郵件地址、頁面位置或 URL 可以表示的任何其他內容的超連結。

<p>You can reach to this link:</p>
<ul>
  <li><a href="https://jsfiddle.net/">JSFiddle</a></li>
</ul>

在此處執行程式碼

輸出:

JavaScript 連結

要保持在同一頁面上,你還可以在 href 屬性中提供名稱或空 URL。

<a href="javascript:;"></a>

上面的程式碼通常用於建立連結,而無需在 href 屬性中指定真正的 URL。

在 JavaScript 中使用帶有雜湊的 href 表示式

雜湊 # 指定一個 HTML 元素 id,其中視窗應在超連結中拖動。

儘管 href="#" 沒有提供 id 名稱,但它確實指定了一個位置 - 頁面頂部。當你單擊帶有 href="#" 的錨點時,滾動位置將移動到頂部。

<h1>Scroll to the bottom of the page and click the link</h1>
<a href="#">Scroll to Top</a>

你可以在此處檢視演示

在 JavaScript 中將 href 表示式與函式一起使用

基本上,不是使用連結來移動頁面(或錨點),而是使用此方法將啟動一個或多個 JavaScript 函式。

<html>
  <body>
    <script>
function doSomething() {
  alert("hello Delft")
}
</script>
<a href="javascript:doSomething();">click me</a>
  </body>
</html>

在此處執行程式碼

當你單擊該連結時,它會觸發警報,呼叫 JavaScript 函式,你將看到一個彈出視窗,上面寫著 hello Delft

輸出:

彈出視窗

Author: Shiv Yadav
Shiv Yadav avatar Shiv Yadav avatar

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn

相關文章 - JavaScript Href