jQuery中$this和$(this)的区别介绍(一看就懂)


Posted in Javascript onJuly 06, 2015
// this其实是一个Html 元素。
// $this 只是个变量名,加$是为说明其是个jquery对象。
// 而$(this)是个转换,将this表示的dom对象转为jquery对象,这样就可以使用jquery提供的方法操作。


(function($){
	$.fn.hilight = function(options){
		debug(this);

		var defaults = {
			foreground: 'red',
			background: 'yellow'
		};

		var opts = $.extend({}, $.fn.hilight.defaults, options);

		return this.each(function() {
      // this其实是一个Html 元素。
      // $this 只是个变量名,加$是为说明其是个jquery对象。
      // 而$(this)是个转换,将this表示的dom对象转为jquery对象,这样就可以使用jquery提供的方法操作。
			$this = $(this);

			// build element specific options
			var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
			
			// update element styles
			$this.css({
				backgroundColor: o.background,
				color: o.foreground
			});

			var markup = $this.html();
			// call our format function

			markup = $.fn.hilight.format(markup);

			$this.html(markup);
		});

	};


	// define our format function
	$.fn.hilight.format = function(txt) {
		return '<strong>' + txt + '</strong>';
	};


	// 插件的defaults
	$.fn.hilight.defaults = {
		foreground: 'red',
		background: 'yellow'
	};

	function debug($obj) {
		if (window.console && window.console.log){
			window.console.log('hilight selection count: ' + $obj.size());
		}
	};

})(jQuery)
Javascript 相关文章推荐
jQuery 设置 CSS 属性示例介绍
Jan 16 Javascript
JS+CSS实现可以凹陷显示选中单元格的方法
Mar 02 Javascript
用户代理字符串userAgent可实现的四个识别
Sep 20 Javascript
JQuery+Ajax实现数据查询、排序和分页功能
Sep 27 Javascript
JS实现选中当前菜单后高亮显示的导航条效果
Oct 15 Javascript
JavaScript知识点总结之如何提高性能
Jan 15 Javascript
jQuery实现立体式数字动态增加(animate方法)
Dec 21 Javascript
JavaScript实现预览本地上传图片功能完整示例
Mar 08 Javascript
微信小程序wepy框架学习和使用心得详解
May 24 Javascript
js实现网页版贪吃蛇游戏
Feb 22 Javascript
JS实现点星星消除小游戏
Mar 24 Javascript
LayUI+Shiro实现动态菜单并记住菜单收展的示例
May 06 Javascript
浅谈Javascript实现继承的方法
Jul 06 #Javascript
JavaScript保存并运算页面中数字类型变量的写法
Jul 06 #Javascript
angularjs客户端实现压缩图片文件并上传实例
Jul 06 #Javascript
jQuery 遍历函数详解
Jul 05 #Javascript
php结合imgareaselect实现图片裁剪
Jul 05 #Javascript
kindeditor编辑器点中图片滚动条往上顶的bug
Jul 05 #Javascript
jQuery插件pagewalkthrough实现引导页效果
Jul 05 #Javascript
You might like
Smarty变量调节器失效的解决办法
2014/08/20 PHP
php绘制圆形的方法
2015/01/24 PHP
PHP新建类问题分析及解决思路
2015/11/19 PHP
Linux+Nginx+MySQL下配置论坛程序Discuz的基本教程
2015/12/23 PHP
apache集成php7.3.5的详细步骤
2019/06/20 PHP
php框架知识点的整理和补充
2021/03/01 PHP
JavaScript 事件记录使用说明
2009/10/20 Javascript
基于jquery的修改当前TAB显示标题的代码
2010/12/11 Javascript
浏览器图片选择预览、旋转、批量上传的JS代码实现
2013/12/04 Javascript
php中给js数组赋值方法
2014/03/10 Javascript
浅谈利用JavaScript进行的DDoS攻击原理与防御
2015/06/04 Javascript
使用jQuery判断浏览器滚动条位置的方法
2016/05/30 Javascript
js输出数据精确到小数点后n位代码
2016/07/02 Javascript
JS声明式函数与赋值式函数实例分析
2016/12/13 Javascript
详解vue嵌套路由-query传递参数
2017/05/23 Javascript
JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】
2018/03/15 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
2018/05/30 Javascript
angularjs手动识别字符串中的换行符方法
2018/10/02 Javascript
Python中datetime常用时间处理方法
2015/06/15 Python
pandas去重复行并分类汇总的实现方法
2019/01/29 Python
python SQLAlchemy的Mapping与Declarative详解
2019/07/04 Python
Python中itertools的用法详解
2020/02/07 Python
python中str内置函数用法总结
2020/12/27 Python
CSS3实现大小不一的粒子旋转加载动画
2016/04/21 HTML / CSS
HTML5播放实现rtmp流直播
2020/06/16 HTML / CSS
Nordgreen英国官网:斯堪的纳维亚设计师手表
2018/10/24 全球购物
奥地利票务门户网站:oeticket.com
2019/12/31 全球购物
C# .NET面试题
2015/11/28 面试题
大学毕业生自我鉴定
2013/11/05 职场文书
教师自荐信
2013/12/10 职场文书
我们的节日清明节活动方案
2014/03/05 职场文书
2014年小班保育员工作总结
2014/12/23 职场文书
消防宣传语大全
2015/07/13 职场文书
Golang 实现获取当前函数名称和文件行号等操作
2021/05/08 Golang
阿里云服务器部署mongodb的详细过程
2021/09/04 MongoDB
Netty客户端接入流程NioSocketChannel创建解析
2022/03/25 Java/Android