jQuery继承extend用法详解


Posted in Javascript onOctober 10, 2016

本文实例为大家jQuery继承extend用法,供大家参考,具体内容如下

js代码

//直接基于jQuery的扩展,判断是否为空 
$.isBlank = function(obj){ 
  return(typeof(obj)=='undefined'||obj==''||obj==null); 
 } 
//直接基于jQuery的扩展,去除html标签,保留内容 
 $.htmlContent = function(tag){ 
  var reTag = /<(?:.|\s)*?>/g; 
  return tag.replace(reTag,""); 
 } 
//直接基于jQuery的扩展(方式二) 
$.xy = { 
sayhello:function(){return "hello";}, 
saybaybay:function(){return "baybay";} 
}; 
//jQuery类级别的扩展 
$.extend({ 
add:function(a,b){return a+b;}, 
diff:function(a,b){return a-b} 
}); 
//jQuery对象级别的扩展 
$.fn.extend({ 
 getvalue:function(){ 
 return this.val(); 
  } 
 });

html代码

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 
<% 
String path = request.getContextPath(); 
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 
%> 
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
 <head> 
 <base href="<%=basePath%>"> 
  
 <title>My JSP 'index.jsp' starting page</title> 
 <meta http-equiv="pragma" content="no-cache"> 
 <meta http-equiv="cache-control" content="no-cache"> 
 <meta http-equiv="expires" content="0">  
 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
 <meta http-equiv="description" content="This is my page"> 
 <!-- 
 <link rel="stylesheet" type="text/css" href="styles.css"> 
 --> 
  
 <script type="text/javascript" src="jquery-1.7.js"></script> 
 <script type="text/javascript" src="jquery-1.7.min.js"></script> 
 <script type="text/javascript" src="my.js"></script> 
 <script type="text/javascript"> 
 $(function(){ 
  var br = $("<br/>"); 
  $(".myspan").append(br); 
 }) 
 </script> 
 </head> 
 <body> 
 <script type="text/javascript"> 
  document.write("判断是否为空:"+$.isBlank(null)); 
 </script> 
 <span class="myspan"></span> 
 <script type="text/javascript"> 
  document.write("过滤html标签:"+$.htmlContent("<html><body><a id='a1'>a标签</a><div style='width:100%'>div标签</div>内容</body></html>")+"<br/>"); 
  document.write("扩展自jQuery类的xy的sayhello方法:"+ $.xy.sayhello()+"</br>"); 
  document.write("扩展自jQuery类的xy的sayhello方法:"+ $.xy.saybaybay()+"</br>"); 
  document.write("基于jQuery类的add法:"+ $.add(3,5)+"</br>"); 
  document.write("基于jQuery类的diff法:"+ $.diff(5,3)+"</br>"); 
  document.write("基于自jQuery类对象的扩展getvalue():"+$("<input type='text' value='str' />").getvalue()+"<br/>"); 
 </script> 
 </body> 
</html>

输出

jQuery继承extend用法详解

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery EasyUI API 中文文档 - ValidateBox验证框
Oct 06 Javascript
百度UEditor编辑器如何关闭抓取远程图片功能
Mar 03 Javascript
JS模拟酷狗音乐播放器收缩折叠关闭效果代码
Oct 29 Javascript
jquery密码强度校验
Dec 02 Javascript
JavaScript实现图片自动加载的瀑布流效果
Apr 11 Javascript
JS 实现随机验证码功能
Feb 15 Javascript
Vue获取DOM元素样式和样式更改示例
Mar 07 Javascript
jQuery中map函数的两种方式
Apr 07 jQuery
JS实现获取数组中最大值或最小值功能示例
Mar 02 Javascript
vue设计一个倒计时秒杀的组件详解
Apr 06 Javascript
js实现浏览器打印功能的示例代码
Jul 15 Javascript
Vue如何循环提取对象数组中的值
Nov 18 Vue.js
mvc 、bootstrap 结合分布式图简单实现分页
Oct 10 #Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
Oct 10 #Javascript
KnockoutJS 3.X API 第四章之数据控制流foreach绑定
Oct 10 #Javascript
KnockoutJS 3.X API 第四章之数据控制流if绑定和ifnot绑定
Oct 10 #Javascript
KnockoutJS 3.X API 第四章之数据控制流with绑定
Oct 10 #Javascript
JS命令模式例子之菜单程序
Oct 10 #Javascript
KnockoutJS 3.X API 第四章之数据控制流component绑定
Oct 10 #Javascript
You might like
php环境套包 dedeampz 伪静态设置示例
2014/03/26 PHP
jQuery+Ajax+PHP“喜欢”评级功能实现代码
2015/10/08 PHP
php is_writable判断文件是否可写实例代码
2016/10/13 PHP
javascript中如何处理引号编码&amp;#034;
2013/08/15 Javascript
捕获和分析JavaScript Error的方法
2014/03/25 Javascript
jQuery.holdReady()使用方法
2014/05/20 Javascript
jquery 新建的元素事件绑定问题解决方案
2014/06/12 Javascript
js数组中如何随机取出一个值
2014/06/13 Javascript
jQuery实现带动画效果的多级下拉菜单代码
2015/09/08 Javascript
AngularJs动态加载模块和依赖注入详解
2016/01/11 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(二)
2016/09/14 Javascript
easyui导出excel无法弹出下载框的快速解决方法
2016/11/10 Javascript
bootstrapValidator.min.js表单验证插件
2017/02/09 Javascript
使用jquery datatable和bootsrap创建表格实例代码
2017/03/17 Javascript
jQuery实现QQ空间汉字转拼音功能示例
2017/07/10 jQuery
详解基于webpack2.x的vue2.x的多页面站点
2017/08/21 Javascript
React Native时间转换格式工具类分享
2017/10/24 Javascript
Vue实现表格中对数据进行转换、处理的方法
2018/09/06 Javascript
详解vue 2.6 中 slot 的新用法
2019/07/09 Javascript
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
2020/09/27 Javascript
[43:48]Ti4正赛第一天 VG vs NEWBEE 2
2014/07/19 DOTA
Python反转序列的方法实例分析
2018/03/21 Python
解决python字典对值(值为列表)赋值出现重复的问题
2019/01/20 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
Python同时处理多个异常的方法
2020/07/28 Python
纯CSS3实现圆圈动态发光特效动画的示例代码
2021/03/08 HTML / CSS
Topshop法国官网:英国快速时尚品牌
2018/04/08 全球购物
计算机应用毕业生自荐信
2013/10/23 职场文书
市场营销专业毕业生自荐信
2013/11/02 职场文书
应征英语教师求职信
2013/11/27 职场文书
活动志愿者自荐信
2014/01/27 职场文书
财务主管岗位职责
2014/02/28 职场文书
党的群众路线教育实践活动查摆问题自查报告
2014/10/10 职场文书
学校领导班子成员查摆问题及整改措施
2014/10/28 职场文书
雨雪天气温馨提示
2015/07/15 职场文书
Python正则表达式中flags参数的实例详解
2022/04/01 Python