JavaScript编程

书签脚本 (Bookmarklets)

书签脚本是一行存储在书签 URL 字段中的脚本。它们已经存在很长时间，因此在较老的浏览器中也能正常工作。

JavaScript URI 方案

您可能熟悉以 http 和 ftp 等方案开头的 URL，例如 http://en.wikibooks.org/。JavaScript 方案也同样存在，并且是所有书签脚本的开头格式：

javascript:alert('Hello, World!');

示例用途

媒体控制

以下示例可以根据需要调整参数。对于嵌入的 <audio> 标签，可以将 video 替换为 audio。

• 循环播放视频：

  javascript:document.getElementsByTagName("video")[0].loop=1;
  javascript:document.getElementsByTagName("video")[0].loop=true; // 也适用
  

  可使用 0 或 false 关闭循环。

• 跳转到 10 分钟（使用乘法）：

  javascript:document.getElementsByTagName("video")[0].currentTime=60*10;
  

• 前进 1 分钟：

  javascript:document.getElementsByTagName("video")[0].currentTime+=60;
  

• 后退 30 秒（使用除法）：

  javascript:document.getElementsByTagName("video")[0].currentTime-=60/2;
  

• 在控制台获取视频时长：

  javascript:document.getElementsByTagName("video")[0].duration;
  

• 弹窗显示视频时长：

  javascript:alert('This video is '+document.getElementsByTagName("video")[0].duration+' seconds long.');
  

• 弹窗显示播放时间：

  javascript:alert('The current position of the video is at '+document.getElementsByTagName("video")[0].currentTime+' seconds.');
  

• 设置音量为 50%：

  javascript:document.getElementsByTagName("video")[0].volume=50/100;
  

• 静音：

  javascript:document.getElementsByTagName("video")[0].muted=1; // "true" 也适用
  

• 取消静音：

  javascript:document.getElementsByTagName("video")[0].muted=0; // 或 false
  

• 将播放速度加倍：

  javascript:document.getElementsByTagName("video")[0].playbackRate=2;
  

• 询问用户播放速度：

  javascript:document.getElementsByTagName("video")[0].playbackRate=parseFloat(prompt("How fast should it play?"));
  

  使用 parseFloat 可防止用户关闭对话框时将值设置为零。

• 询问播放位置（以秒为单位）：

  javascript:document.getElementsByTagName("video")[0].currentTime=parseFloat(prompt("Jump to playback position in seconds:"));
  

• 询问播放位置（以分钟为单位）：

  javascript:document.getElementsByTagName("video")[0].currentTime=60*parseFloat(prompt("Jump to playback position in minutes:"));
  

• 询问播放位置（以百分比为单位，0 到 100）：

  javascript:document.getElementsByTagName("video")[0].currentTime=document.getElementsByTagName("video")[0].duration/100*parseFloat(prompt("Jump to playback position in percents:"));
  

使用多行代码

由于书签脚本中不能有换行符，您必须在每条语句末尾使用分号。

javascript:name=prompt('What is your name?'); alert('Hello, ' + name);

链接中的 JavaScript 协议

JavaScript 协议可以用于 HTML 链接中。尽管如此，这种做法可能被认为是不良实践，因为它可能会对禁用 JavaScript 的用户造成困扰。

<a href="javascript:document.bgColor='#0000FF'">blue background</a>

示例

更多示例可以在 bookmarklets.com 找到，展示了许多可以用 JavaScript 实现的功能。