之前例子是扩展jQuery的工具方法，即通过$.xxx(para);的形式来使用的。下面是扩展jquery对象的方法，即任意一个jquery对象都已访问。

具体如下：

wyl.js:

 (function($){

     //访问方法： $('span p').siblings().chgColor();//所有祖先元素为span的p元素的相邻元素

     //作用：设置jquery对象的颜色

     $.fn.chgColor = function(colors){

         var tmpColor = colors;

         var flag = !(tmpColor);

         if(!(tmpColor)){

             // tmpColor = 'orange';

             tmpColor = '#93DDFF';//蓝色

         }

         if(typeof tmpColor!='string'){

             alert('传入的参数必须是string型的');

             return false;

         }

         $(this).css('background',tmpColor);

     }

 })(jQuery)

html:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

 <script type="text/javascript" src="wyl.js"></script>

 <script>

 $(function(){

     // $('div').next('p').css('background','red');

     // $('span~p').chgColor();//查找span标记后所有同级的p标记

     // $('span~p').chgColor();//查找span标记后所有同级的p标记

     $('span p').siblings().chgColor();//所有祖先元素为span的p元素的相邻元素

     // $('span').siblings('.haha').chgColor('orange');//找到span元素同级别元素中class为haha的元素

     // $('span').siblings('div').chgColor('orange');//找到span元素所有同辈元素中 为 div元素的 元素

 });

 </script>

 </head>

 <body>

 <div>11111</div>

 <p>11111</p>

 <div>22222</div>

 <span>2222</span>

 <p>22222</p>

 <p class="haha">33333</p>

 <span><p>44444</p><br><div>我是又一个div</div></span>

 <div><p>我是div下的p元素</p></div>

 <p>55555</p>

 <p>6666</p>

 </body>

 </html>

效果：

jQuery $.fn.extend方式自定义插件的更多相关文章

  1. jQuery $.fn.extend()方法类插件

    一.为JQuery原型扩展新的属性和方法,然后在JQuery的实例对象上调用 在 jQuery 中,我们可以使用$.fn.extend()方法来定义一个方法类插件.方法类插件就是首先你使用 jQuer ...

  2. 理解jquery的$.extend()、$.fn.extend()【jQuery插件机制】

    /** * 操作数据 | DOM 操作 * @description jQuery类添加类方法,可以理解为添加静态方法,将一个或多个对象的内容合并到目标对象 * @use $.fn.zhang() | ...

  3. 理解jQuery的$.extend与$.fn.extend

    https://www.cnblogs.com/xuxiuyu/p/5989743.html 上面这篇博客总结的很棒!!,以下对自己的认识做一个总结 <!DOCTYPE html> < ...

  4. jQuery开发自定义插件 $.extend()与$.fn.extend()

    jQuery extend()和jQuery.fn.extend() jQuery提供两个用于封装扩展的方法: 1.$.extend(); 扩展jQuery类方法,即jQuery全局方法 (在全局可直 ...

  5. Jquery自定义插件之$.extend()、$.fn和$.fn.extend()

    jquery插件的种类: 1.对象级别的插件开发,即给jQuery对象添加方法,封装对象方法的插件,如:parent().appendTo() 2.一种是类级别的插件开发,即给jQuery添加新的全局 ...

  6. jquery插件之jquery.extend和jquery.fn.extend的区别

    jquery.extend jquery.extend(),是拓展jquery这个类,即可以看作是jquery这个类本身的静态方法,例如: <!DOCTYPE html> <html ...

  7. jQuery 第九章 工具方法之插件扩展 $.extend() 和 $.fn.extend()

    $.extend() $.fn.extend() -------------------------------------------------- $.extend() 插件扩展(工具方法) jq ...

  8. jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...

  9. 利用jQuery对插件进行扩展时，方法$.extend()、$.fn.extend()区别与联系

      利用JQ开发插件的方法: 1.jQuery.extend(); 2.jQuery.fn.extend(); 3.通过$.widget()应用jQuery UI的部件工厂方式创建. 由于第三种方式通 ...

随机推荐

  1. Codeforces 706D Vasiliy's Multiset（可持久化字典树）

    [题目链接] http://codeforces.com/problemset/problem/706/D [题目大意] 要求实现一个集合中的三个操作,1:在集合中加入一个元素x,2:从集合中删除一个 ...

  2. DrawerLayout、CoordinatorLayout、CollapsingToolbarLayout的使用--AndroidSupportDesign练手

    先po一张效果图 PS:原谅题主的懒惰吧.. 看着是不是很酷炫,那是因为5.0的动画做得好,代码其实没有多少,搞清楚这个布局的层次关系很重要. 废话不多说了,先来看布局文件 最外层是一个DrawerL ...

  3. 我的MYSQL学习心得 备份和恢复(详细)

    备份 逻辑备份方法 使用MYSQLDUMP命令备份 MYSQLDUMP是MYSQL提供的一个非常有用的数据库备份工具.mysqldump命令执行时将数据库备份成一个文本文件, 该文件中实际上包含了多个 ...

  4. Yii2简单纪要

    网上经常拿Yii来类比ROR,从MVC角度,使用体验及代码风格上确实有很多相似的地方.不过看配置文件发现Yii2不止是受rails的影响,同样有不少spring的影子,最明显的就是配置文件中很多IOC ...

  5. 从Android中Activity之间的通信说开来[转]

    http://www.cnblogs.com/virusswb/archive/2011/08/02/2124824.html 引言 最近两个星期在研究android的应用开发,学习了android应 ...

  6. javascript操作HTML元素

    操作 HTML 元素 如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法. 请使用 "id" 属性来标 ...

  7. iOS 自定义各类bar的属性

    在iOS应用开发中,经常需要为导航栏和标签栏设置相同的主题,一个一个去设置的话,就太麻烦了,可以通过对应用中所有的导航栏和标签栏同意设置背景.字体等属性. 如:创建一个继承自“UINavigation ...

  8. C++内联函数、函数模板之于头文件

    一.基本说明 C++标准中提到,一个编译单元是指一个.cpp文件以及它所include的所有.h文件,.h文件里的代码将会被扩展到包含它的.cpp文件里,然后编译器编译该.cpp文件为一个.obj文件 ...

  9. 64位系统未注册"MSDAORA.1"提供程序

    原因:如错误,64位系统未注册"MSDAORA.1"提供程序 解决:在IIS应用程序池中找到自己的网站,打开高级设置,设置“启用32位应用程序”为“True”即可. 另外还有其他解 ...

  10. nexus REST API /artifact/maven/[resolve|redirect] returns unexpected for v=LATEST

    Novice nexus oss (2.0.0) user here – getting unexpected results when requesting v=LATEST artifact fr ...