简介

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

      // 修改书签的 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. 网络通信协议

javascript 通信协议的更多相关文章

  1. Split Screen

    Split Screen 是一个用来分屏的 bookmarklet 程序. 它通过 javascript 通信协议实现[1]. 特点 使用 HTML5 <dialog> 元素实现 使用 G ...

  2. JavaScript标准参考教材(alpha)--笔记

    一.导论 二.基本语法 1.严格来说var a=1与a=1效果不太一样,delete命令无法删除前者. JavaScirpt是一种动态类型语言,也就是说,变量的类型没有限制,可以赋予各种类型的值. J ...

  3. Javascript Window Location

    window.location 对象在编写时可不使用 window 这个前缀. URL : 统一资源定位符 (Uniform Resource Locator) 说明: 完整的URL示例:scheme ...

  4. JavaScript最全的10种跨域共享的方法

    在客户端编程语言中,如javascript和ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义.同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和 ...

  5. JavaScript 跨域方法总结

    同源策略 在客户端编程语言中,如javascript和 ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义.同源策略规定跨域之间的脚本是隔离的,一个域的脚 ...

  6. JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 1 ...

  7. HTML/CSS/JavaScript学习总结(转)

    HTML 网站开发的主要原则是: – 用标签元素HTML描述网页的内容结构: – 用CSS描述网页的排版布局: – 用JavaScript描述网页的事件处理,即鼠标或键盘在网页元素上的动作后的程序 H ...

  8. 前端开发面试题总结之——JAVASCRIPT(一)

    ___________________________________________________________________________________ 相关知识点 数据类型.运算.对象 ...

  9. JavaScript / 本地存储

    cookie 首先让我们先了解一下,什么是cookie,cookie是浏览器提供的一种机制,他将document.cookie的接口提供给JavaScript使其可以对cookie进行控制,但cook ...

随机推荐

  1. 使用反应式关系数据库连接规范R2DBC操作MySQL数据库

    1. 简介 三月份已经介绍过R2DBC,它是一种异步的.非阻塞的关系式数据库连接规范.尽管一些NoSQL数据库供应商为其数据库提供了反应式数据库客户端,但对于大多数项目而言,迁移到NoSQL并不是一个 ...

  2. 【题解】[BalticOI 2014]friends

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3916 (BZOJ3916) 由题意可知 \(N\) 得为奇数,\(S\) 才存在,所以先特 ...

  3. junit搭建自动化测试框架(一)

    这里主要使用Junit搭建一个分层的自动化测试框架.这就是一个有业务逻辑的单元测试的思想.灵活性很大,对测试人员的代码能力要求较高. 以登录QQ邮箱为例,数据源使用了集合接口Map.借鉴了MVC的思想 ...

  4. github知名企业开源项目索引

    亚马逊:https://github.com/amzn 饿了么 https://github.com/ElemeFEhttp://lrd.ele.me/腾讯 https://github.com/Te ...

  5. 快速认识elasticsearch

    快速认识elasticsearch   what is Elasticsearch Elasticsearch被称为"Lucene穿了一件json的外衣"---把Lucene用Ne ...

  6. 帝国の狂欢(种树)(可撤销DP)

    题目描述 马上就要开学了!!! 为了给回家的童鞋们接风洗尘,HZOI帝国的老大决定举办一场狂欢舞会. 然而HZOI帝国头顶上的HZ大帝国十分小气,并不愿意给同学们腾出太多的地方.所以留给同学们开par ...

  7. JSOI2016 病毒感染(动态规划)

    题目传送门:洛谷P5774 思路来源:郭大佬(我就是凑不要脸的白嫖党 : P) 题目分析: 我们一点点来分析这道题: 起点固定为1号,所有村庄是按线性排列的,而不是图,所以我们应该用线性DP(废话 ) ...

  8. POJ - 3463 Sightseeing 最短路计数+次短路计数

    F - Sightseeing 传送门: POJ - 3463 分析 一句话题意:给你一个有向图,可能有重边,让你求从s到t最短路的条数,如果次短路的长度比最短路的长度多1,那么在加上次短路的条数. ...

  9. JAVA的8种基本数据类型分析

    基本数据类型(8个) 1.整数类型(4个)   字节个数 取值范围 byte(字节) 1(8位) -2^7~2^7-1 short(短整型) 2(16位) -2^15~2^15-1 int(整形) 4 ...

  10. 链表中倒数第k个节点(剑指offer-14)

    /* public class ListNode { int val; ListNode next = null; ListNode(int val) { this.val = val; } }*/ ...