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 相关文章推荐
在IE下获取object(ActiveX)的Param的代码
Sep 15 Javascript
jquery的Theme和Theme Switcher使用小结
Sep 08 Javascript
jquery对表单操作2
Apr 06 Javascript
利用js 进行输入框自动匹配字符的小例子
Jun 29 Javascript
基于jquery实现的图片在各种分辨率下未知的容器内上下左右居中
May 11 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
Sep 28 Javascript
javascript图片滑动效果实现
Jan 28 Javascript
第五篇Bootstrap 排版
Jun 21 Javascript
jQuery事件绑定用法详解
Sep 08 Javascript
Vue-Router2.X多种路由实现方式总结
Feb 09 Javascript
Vue源码探究之状态初始化
Nov 14 Javascript
基于vue如何发布一个npm包的方法步骤
May 15 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
PHP学习散记_编码(json_encode 中文不显示)
2011/11/10 PHP
php实现数组筛选奇数和偶数示例
2014/04/11 PHP
php缓冲输出实例分析
2015/01/05 PHP
基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据
2015/09/23 PHP
php代码架构的八点注意事项
2016/01/25 PHP
php处理带有中文URL的方法
2016/07/11 PHP
php利用gd库为图片添加水印
2016/11/09 PHP
thinkphp修改配置进入默认首页的方法
2017/02/07 PHP
PHP使用redis消息队列发布微博的方法示例
2017/06/22 PHP
laravel 中某一字段自增、自减的例子
2019/10/11 PHP
PHP实现微信提现功能(微信商城)
2019/11/21 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
JS 容错处理代码, 屏蔽错误信息
2021/03/09 Javascript
javascript分页代码(当前页码居中)
2012/09/20 Javascript
javascript实现类似百度分享功能的方法
2015/07/27 Javascript
Javascript 跨域知识详细介绍
2016/10/30 Javascript
使用snowfall.jquery.js实现爱心满屏飞的效果
2017/01/05 Javascript
axios拦截设置和错误处理方法
2018/03/05 Javascript
微信小程序实现页面下拉刷新和上拉加载功能详解
2018/12/03 Javascript
ES2020让代码更优美的运算符 (?.) (??)
2021/01/04 Javascript
详解Python的Django框架中inclusion_tag的使用
2015/07/21 Python
解决Python print 输出文本显示 gbk 编码错误问题
2018/07/13 Python
Python定时任务sched模块用法示例
2018/07/16 Python
python爬虫获取新浪新闻教学
2018/12/23 Python
python 中的[:-1]和[::-1]的具体使用
2020/02/13 Python
Python Selenium安装及环境配置的实现
2020/03/17 Python
canvas实现有递增动画的环形进度条的实现方法
2019/07/10 HTML / CSS
美国在线精品家居网站:Burke Decor
2017/04/12 全球购物
请用用Java代码写一个堆栈
2012/01/26 面试题
创业女性典型材料
2014/05/02 职场文书
企业公益活动策划方案
2014/08/24 职场文书
交通运输局四风问题对照检查材料思想汇报
2014/10/09 职场文书
2015年档案管理工作总结
2015/04/08 职场文书
2016年乡镇七一建党节活动总结
2016/04/05 职场文书
创业方案:赚钱的烧烤店该怎样做?
2019/07/05 职场文书
如何优化vue打包文件过大
2022/04/13 Vue.js