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实际应用:innerHTMl和确认提示的使用
Jun 22 Javascript
用Javascript读取中文COOKIE的解决办法
Feb 15 Javascript
JavaScript 判断浏览器类型及版本
Feb 21 Javascript
事件绑定之小测试  onclick &amp;&amp; addEventListener
Jul 31 Javascript
JavaScript高级程序设计(第3版)学习笔记 概述
Oct 11 Javascript
window.open关于浏览器拦截问题分析及解决方法
Feb 05 Javascript
jQuery each函数源码分析
May 25 Javascript
Javascript之Date对象详解
Jun 07 Javascript
Bootstrap表单布局
Jul 19 Javascript
原生js实现jquery函数animate()动画效果的简单实例
Aug 21 Javascript
thinkjs 文件上传功能实例代码
Nov 08 Javascript
vue中使用sessionStorage记住密码功能
Jul 24 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/04/26 PHP
thinkphp5.0整合phpsocketio完整攻略(绕坑)
2018/10/12 PHP
PHP时间戳和日期相互转换操作实例小结
2018/12/18 PHP
BOM与DOM的区别分析
2010/10/26 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
浅谈js多维数组和hash数组定义和使用
2016/07/27 Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
2016/10/14 Javascript
javascript 中的事件委托详解
2016/10/25 Javascript
js图片轮播手动切换特效
2017/01/12 Javascript
JS按条件 serialize() 对应标签的使用方法
2017/07/24 Javascript
bootstrap中日历范围选择插件daterangepicker的使用详解
2018/04/17 Javascript
小程序转发探索示例
2019/02/19 Javascript
jQuery pager.js 插件动态分页功能实例分析
2019/08/02 jQuery
python标准日志模块logging的使用方法
2013/11/01 Python
Python生成随机数的方法
2014/01/14 Python
Python的subprocess模块总结
2014/11/07 Python
numpy使用技巧之数组过滤实例代码
2018/02/03 Python
python实现定时自动备份文件到其他主机的实例代码
2018/02/23 Python
python线程定时器Timer实现原理解析
2019/11/30 Python
python爬取抖音视频的实例分析
2021/01/19 Python
TheFork葡萄牙:欧洲领先的在线餐厅预订平台
2019/05/27 全球购物
护士辞职信范文
2014/01/19 职场文书
大学生自我评价范文分享
2014/02/21 职场文书
爱情保证书
2015/01/17 职场文书
2015年清明节活动总结
2015/02/09 职场文书
ktv服务员岗位职责
2015/02/09 职场文书
银行自荐信怎么写
2015/03/05 职场文书
电力企业职工培训心得体会
2016/01/11 职场文书
《酸的和甜的》教学反思
2016/02/18 职场文书
2019求职信大礼包
2019/05/15 职场文书
话题作文之成长
2019/12/09 职场文书
php远程请求CURL案例(爬虫、保存登录状态)
2021/04/01 PHP
MySQL中InnoDB存储引擎的锁的基本使用教程
2021/05/26 MySQL
spring项目中切面及AOP的使用方法
2021/06/26 Java/Android
用Python实现屏幕截图详解
2022/01/22 Python