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 Prototype 对象扩展
May 15 Javascript
javascript实现带下拉子菜单的导航菜单效果
May 14 Javascript
使用JQuery在线制作ppt并在线演示源码特效
Sep 08 Javascript
jQuery带进度条全屏图片轮播特效代码分享
Jun 28 Javascript
跟我学习javascript的prototype使用注意事项
Nov 17 Javascript
学习javascript面向对象 理解javascript原型和原型链
Jan 04 Javascript
浅谈js数据类型判断与数组判断
Aug 29 Javascript
浅谈js中startsWith 函数不能在任何浏览器兼容的问题
Mar 01 Javascript
加载 vue 远程代码的组件实例详解
Nov 20 Javascript
一个简单的node.js界面实现方法
Jun 01 Javascript
使用electron将vue-cli项目打包成exe的方法
Sep 29 Javascript
详解JavaScript的数据类型以及数据类型的转换
Apr 20 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
索尼ICF-SW100收音机评测
2021/03/02 无线电
用PHPdig打造属于你自己的Google[图文教程]
2007/02/14 PHP
php xml常用函数的集合(比较详细)
2013/06/06 PHP
Ubuntu中搭建Nginx、PHP环境最简单的方法
2015/03/05 PHP
php原生导出excel文件的两种方法(推荐)
2016/11/19 PHP
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
JavaScript 事件系统
2010/07/22 Javascript
js限制textarea每行输入字符串长度的代码
2012/10/31 Javascript
解决jquery中美元符号命名冲突问题
2014/01/08 Javascript
js四舍五入数学函数round使用实例
2014/05/09 Javascript
javascript实现列表滚动的方法
2015/07/30 Javascript
详解Node.js中的事件机制
2016/09/22 Javascript
jQuery继承extend用法详解
2016/10/10 Javascript
BootStrop前端框架入门教程详解
2016/12/25 Javascript
详解如何让InstantClick兼容MathJax、百度统计等
2017/09/12 Javascript
浅谈NodeJs之数据库异常处理
2017/10/25 NodeJs
代码详解JS操作剪贴板
2018/02/11 Javascript
微信小程序实现红包功能(后端PHP实现逻辑)
2018/07/11 Javascript
在vue中使用el-tab-pane v-show/v-if无效的解决
2020/08/03 Javascript
vue实现标签云效果的示例
2020/11/09 Javascript
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
Python使用dis模块把Python反编译为字节码的用法详解
2016/06/14 Python
Python首次安装后运行报错(0xc000007b)的解决方法
2016/10/18 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
Pycharm 设置自定义背景颜色的图文教程
2018/05/23 Python
pygame游戏之旅 添加游戏介绍
2018/11/20 Python
python爬虫实现获取下一页代码
2020/03/13 Python
利用python3筛选excel中特定的行(行值满足某个条件/行值属于某个集合)
2020/09/04 Python
Python字符串的15个基本操作(小结)
2021/02/03 Python
Django项目在pycharm新建的步骤方法
2021/03/02 Python
法国大使拉杆箱官网:DELSEY Paris
2018/03/20 全球购物
瑞士领先的网上超市:LeShop.ch
2018/11/14 全球购物
运行时异常与一般异常有何异同?
2014/01/05 面试题
.NET面试10题
2014/02/24 面试题
工作中的自我评价如何写好
2013/10/28 职场文书
Sql Server 行数据的某列值想作为字段列显示的方法
2022/04/20 SQL Server