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 相关文章推荐
JavaScript 学习笔记(十三)Dom创建表格
Jan 21 Javascript
20款超赞的jQuery插件 Web开发人员必备
Feb 26 Javascript
JavaScript中实现继承的三种方式和实例
Jan 29 Javascript
使用javascript实现判断当前浏览器
Apr 14 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
JS取数字小数点后两位或n位的简单方法
Oct 24 Javascript
jQuery 添加样式属性的优先级别方法(推荐)
Jun 08 jQuery
详解node Async/Await 更好的异步编程解决方案
May 10 Javascript
js实现录音上传功能
Nov 22 Javascript
JavaScript中的this基本问题实例小结
Mar 09 Javascript
vue-cli3中配置alias和打包加hash值操作
Sep 04 Javascript
解决Vue-cli3没有vue.config.js文件夹及配置vue项目域名的问题
Dec 04 Vue.js
基于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
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
php中json_decode()和json_encode()的使用方法
2012/06/04 PHP
php使用filter过滤器验证邮箱 ipv6地址 url验证
2013/12/25 PHP
推荐一本PHP程序猿都应该拜读的书
2014/12/31 PHP
php中ob函数缓冲机制深入理解
2015/08/03 PHP
PHPMailer发送邮件
2016/12/28 PHP
用jscript实现新建word文档
2007/06/15 Javascript
基于jQuery的js分页代码
2010/06/10 Javascript
js 控制页面跳转的5种方法
2013/09/09 Javascript
全面了解JS中的匿名函数
2016/06/29 Javascript
Angular.js中处理页面闪烁的方法详解
2017/03/09 Javascript
详解在Vue.js编写更好的v-for循环的6种技巧
2020/04/14 Javascript
vue缓存之keep-alive的理解和应用详解
2020/11/02 Javascript
[01:07:46]完美世界DOTA2联赛循环赛 Magma vs IO BO2第二场 11.01
2020/11/02 DOTA
python实现给数组按片赋值的方法
2015/07/28 Python
Python3的urllib.parse常用函数小结(urlencode,quote,quote_plus,unquote,unquote_plus等)
2016/09/18 Python
Python中的Numpy矩阵操作
2018/08/12 Python
python 实现UTC时间加减的方法
2018/12/31 Python
django之静态文件 django 2.0 在网页中显示图片的例子
2019/07/28 Python
Django中的cookie和session
2019/08/27 Python
pygame用blit()实现动画效果的示例代码
2020/05/28 Python
python3定位并识别图片验证码实现自动登录功能
2021/01/29 Python
CSS3 圆角效果
2009/07/15 HTML / CSS
CSS伪类与CSS伪元素的区别及由来具体说明
2012/12/07 HTML / CSS
移动端解决悬浮层(悬浮header、footer)会遮挡住内容的3种方法
2015/03/27 HTML / CSS
Mamas & Papas沙特阿拉伯:英国最受欢迎的婴儿品牌
2017/11/20 全球购物
bareMinerals官网:矿物质化妆品和护肤品
2018/02/04 全球购物
瑞士灯具购物网站:Lampenwelt.ch
2018/07/08 全球购物
CHARLES & KEITH澳大利亚官网:新加坡时尚品牌
2019/01/22 全球购物
印尼在线旅游门户网站:NusaTrip
2019/11/01 全球购物
大学在校生求职信范文
2013/11/21 职场文书
《跨越百年的美丽》教学反思
2014/02/11 职场文书
基层党组织公开承诺书
2014/03/28 职场文书
项目建议书范文
2014/05/12 职场文书
红色故事演讲稿
2014/05/22 职场文书
文案策划岗位职责
2015/02/11 职场文书