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 相关文章推荐
jQuery 表单验证扩展(三)
Oct 20 Javascript
js判断一个字符串是否包含一个子串的方法
Jan 26 Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
Dec 18 Javascript
动态生成的DOM不会触发onclick事件的原因及解决方法
Aug 06 Javascript
Jquery组件easyUi实现手风琴(折叠面板)示例
Aug 23 Javascript
微信小程序  modal弹框组件详解
Oct 27 Javascript
简单理解js的冒泡排序
Dec 19 Javascript
node跨域转发 express+http-proxy-middleware的使用
May 31 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
Nov 22 Javascript
vuex state中的数组变化监听实例
Nov 06 Javascript
Vue初始化中的选项合并之initInternalComponent详解
Jun 11 Javascript
JavaScript 常见的继承方式汇总
Sep 17 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
10个实用的PHP代码片段
2011/09/02 PHP
使用PHP获取汉字的拼音(全部与首字母)
2013/06/27 PHP
php检查日期函数checkdate用法实例
2015/03/19 PHP
PHP实现多级分类生成树的方法示例
2017/02/07 PHP
docker-compose部署php项目实例详解
2019/07/30 PHP
js removeChild 障眼法 可能出现的错误
2009/10/06 Javascript
也说JavaScript中String类的replace函数
2011/09/22 Javascript
javascript 事件处理程序介绍
2012/06/27 Javascript
js数组方法扩展实现数组统计函数
2014/04/09 Javascript
jquery实现跳到底部,回到顶部效果的简单实例(类似锚)
2016/07/10 Javascript
AngularJS教程之MVC体系结构详解
2016/08/16 Javascript
浅谈JavaScript 函数参数传递到底是值传递还是引用传递
2016/08/23 Javascript
js自定义QQ菜单效果
2017/01/10 Javascript
codeMirror插件使用讲解
2017/01/16 Javascript
angular2+nodejs实现图片上传功能
2017/03/27 NodeJs
微信小程序 本地数据读取实例
2017/04/27 Javascript
详解React Native网络请求fetch简单封装
2017/08/10 Javascript
layui清空,重置表单数据的实例
2019/09/12 Javascript
JavaScript ES 模块的使用
2020/11/12 Javascript
[04:12]第二届DOTA2亚洲邀请赛选手传记-Newbee.Sccc
2017/04/03 DOTA
python之import机制详解
2014/07/03 Python
Python使用sorted对字典的key或value排序
2018/11/15 Python
python截取两个单词之间的内容方法
2018/12/25 Python
python 双循环遍历list 变量判断代码
2020/05/04 Python
浅析Python 责任链设计模式
2020/09/11 Python
Selenium执行完毕未关闭chromedriver/geckodriver进程的解决办法(java版+python版)
2020/12/07 Python
AP澳洲中文网:澳洲正品直邮,包税收件无忧
2019/07/12 全球购物
为什么在使用动态 SQL 语句时必须为低层数据库对象授予权限
2012/12/13 面试题
国际贸易个人求职信范文
2014/01/04 职场文书
酒店个人求职信范文
2014/01/25 职场文书
装修施工安全责任书
2014/07/24 职场文书
2014县政府领导班子对照检查材料思想汇报
2014/09/25 职场文书
大学生迟到检讨书500字
2014/10/17 职场文书
大一学生个人总结
2015/02/15 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python
基于Python编写简易版的天天跑酷游戏的示例代码
2022/03/23 Python