javascript 通信協議


簡介

javascript 通信協議是一個偽協議[1], 用於指定 URL 為 JavaScript 代碼

  • 語法:

    javascript:someScript;
    
    • someScript 是一個或多個使用 ; 分隔的 JavaScript 語句.
  • 示例

    <a href="javascript:alert('JavaScript Link!');">JavaScript Link</a>
    

特點

  • 返回值會替換當前文檔

    • 對於 Chrome 瀏覽器來說, 如果最后一條 JavaScript 語句的值為字符串 (使用'', ""` 括起來的值), 那么該字符串會替換當前文檔的內容, 作為新文檔顯示出來

    • 對於 Firefox 瀏覽器來說, 如果最后一條瀏覽器的返回值不為 undefined, 那么就調用該返回值的 toString() 方法 (如果 toString() 方法不存在就調用 valueOf() 方法), 得到的結果作為新文檔顯示出來

    • 返回值為 undefined 的幾種常見寫法

      javascript:;
      
      javascript:undefined;  // 全局變量 undefined 的值可能被更改
      
      // void 將之后的內容當作表達式, 然后對該表達是求值, 並始終返回 undefined, 而不管全局變量 undefined 的值是否被改變
      // 以下寫法等價
      javascript:void(0);
      javascript:void 0;
      

用途

  • 任何使用 URL 的地方都可以使用該通信協議
    • 在保留錨元素 href 屬性的同時防止點擊錨元素頁內/外跳轉

      javascript:;
      javascript:undefined;
      javascript:void(0);
      
    • 當作 bookmarklet 這里寫了個小 Demo

      // 修改書簽的 URL 為以下代碼, 就可實現分屏功能
      javascript:'<html><head><title>'+document.title+'</title></head><body style="margin:0;"><iframe style="border:none;" width="50%" height="100%" src='+location.href+'></iframe><iframe style="border:none;" width="50%" height="100%" src='+location.href+'></iframe></body></html>';
      
    • 執行 JavaScript 代碼 (不推薦)

      // 更改頁面背景為綠色 (推薦為錨元素綁定事件來更改頁面背景)
      <a href="javascript:void(document.body.style.backgroundColor='green');">
      
      // 打開新頁面 (注意需返回 undefined, 否則在火狐瀏覽器會替換文檔)
      <a href="javascript:window.open('about:blank'); void(0);">
      

  1. 網絡通信協議 ↩︎


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM