Bookmarklet实现启动jQuery(模仿 云输入法)


Posted in Javascript onSeptember 15, 2010

书签本来是用来收藏 网址(http://momo.site.com/), 但实际上书签还可以收藏 javascript代码
只要把书签中的地址url, 换成javascript代码就可以了。

javascript:your_javascript_expression

上面的 javascript : 可以认为是javascript协议, 就像http: 是http协议一样。
下面是 启动jQuery 书签的地址:
javascript:( 
function(jquery_node){ 
var disable = function(src_node) { 
src_node.parentNode.removeChild(src_node); 
jQuery.noConflict(1); 
}; 
var enable = function(d,j){ 
j=d.createElement('script'); 
j.id='jquery_src_code'; 
j.src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'; 
d.getElementsByTagName('head')[0].appendChild(j); 
}; 
!!jquery_node ? disable(jquery_node) 
: enable(document); 
})(document.getElementById('jquery_src_code'))

为了在网页上可以让用户收藏,你需要把它放入一个<a>链接中。
比如:
<a href="javascript:your_js_code" title="启动jQuery"><span>启动jQuery</span></a>

全部的代码是:
<a class="how-to-install" id="bookmarklet" title="启动jQuery" 
href=" 
javascript:( 
function(jquery_node){ 
var disable = function(src_node) { 
src_node.parentNode.removeChild(src_node); 
jQuery.noConflict(1); 
}; 
var enable = function(d,j){ 
j=d.createElement('script'); 
j.id='jquery_src_code'; 
j.src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'; 
d.getElementsByTagName('head')[0].appendChild(j); 
}; 
!!jquery_node ? disable(jquery_node) 
: enable(document); 
})(document.getElementById('jquery_src_code'))"> 
<span>启动jQuery</span> </a>

结果如下:
启动jQuery
你可以收藏上面的书签了 (右键,点击 "将此链接加为书签");
FireBug---》 Console ,试试 jQuery的魅力吧.
jQuery('a');
$('a') 可能会失效,因为可能一开始就有 window.$对象(包含了别的js库,或网站自己定义了$对象)
cnblogs 的网站就使用jQuery库。
Javascript 相关文章推荐
js event事件的传递与冒泡处理
Dec 06 Javascript
JavaScript动态插入script的基本思路及实现函数
Nov 11 Javascript
JS获得浏览器版本和操作系统版本的例子
May 13 Javascript
moment.js轻松实现获取当前日期是当年的第几周
Feb 05 Javascript
zepto.js中tap事件阻止冒泡的实现方法
Feb 12 Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
Jun 20 Javascript
使用Vue.js创建一个时间跟踪的单页应用
Nov 28 Javascript
[原创]JS基于FileSaver.js插件实现文件保存功能示例
Dec 08 Javascript
详解vue-cli 构建Vue项目遇到的坑
Aug 30 Javascript
js canvas实现画图、滤镜效果
Nov 27 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
Jan 27 Javascript
Vue.js实现大转盘抽奖总结及实现思路
Oct 09 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件打包下载
Sep 15 #Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 #Javascript
jQuery获取css z-index在各种浏览器中的返回值
Sep 15 #Javascript
JavaScript具有类似Lambda表达式编程能力的代码(改进版)
Sep 14 #Javascript
手把手教你自己写一个js表单验证框架的方法
Sep 14 #Javascript
(jQuery,mootools,dojo)使用适合自己的编程别名命名
Sep 14 #Javascript
修改jquery里的dialog对话框插件为框架页(iframe) 的方法
Sep 14 #Javascript
You might like
浅谈PHP变量作用域以及地址引用问题
2013/12/27 PHP
jquery获取input的value问题说明
2010/08/19 Javascript
functional继承模式 摘自javascript:the good parts
2011/06/20 Javascript
jQuery图片预加载 等比缩放实现代码
2011/10/04 Javascript
纯js写的分页表格数据为json串
2014/02/18 Javascript
详解javascript实现自定义事件
2016/01/19 Javascript
jQuery+css实现的tab切换标签(兼容各浏览器)
2016/01/28 Javascript
浅谈jQuery中的checkbox问题
2016/08/10 Javascript
浅谈jquery之on()绑定事件和off()解除绑定事件
2016/10/26 Javascript
js实现自动轮换选项卡
2017/01/13 Javascript
详解vue表单验证组件 v-verify-plugin
2017/04/19 Javascript
详解Angular 4 表单快速入门
2017/06/05 Javascript
AngularJS中控制器函数的定义与使用方法示例
2017/10/10 Javascript
微信小程序如何使用云开发
2019/05/17 Javascript
浅谈Vue.use到底是什么鬼
2020/01/21 Javascript
vue实现移动端返回顶部
2020/10/12 Javascript
[19:24]DOTA2客户端使用指南 一分钟快速设置轻松超神
2013/09/24 DOTA
python处理中文编码和判断编码示例
2014/02/26 Python
Python中input与raw_input 之间的比较
2017/08/20 Python
用pandas按列合并两个文件的实例
2018/04/12 Python
Python将list中的string批量转化成int/float的方法
2018/06/26 Python
python使用epoll实现服务端的方法
2018/10/16 Python
Python 通过打码平台实现验证码的实现
2019/05/13 Python
Python 运行.py文件和交互式运行代码的区别详解
2019/07/02 Python
Python远程开发环境部署与调试过程图解
2019/12/09 Python
tensorflow如何继续训练之前保存的模型实例
2020/01/21 Python
在线实验室测试:HealthLabs.com
2020/05/03 全球购物
英国排名第一的冲浪店:Ann’s Cottage
2020/06/21 全球购物
类的核心特性有哪些
2014/01/01 面试题
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
党风廉政承诺书
2014/03/27 职场文书
2014年新生军训方案
2014/05/01 职场文书
幼儿园六一亲子活动方案
2014/08/26 职场文书
个人租房协议书(范本)
2014/10/14 职场文书
2014年干部培训工作总结
2014/12/17 职场文书
学会用Python实现滑雪小游戏,再也不用去北海道啦
2021/05/20 Python