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 相关文章推荐
js DataSet数据源处理代码
Mar 29 Javascript
jQuery EasyUI API 中文文档 DateTimeBox日期时间框
Oct 16 Javascript
javascript中this的四种用法
May 11 Javascript
Node.js静态文件服务器改进版
Jan 10 Javascript
AngularJS 2.0新特性有哪些
Feb 18 Javascript
详解Javascript数据类型的转换规则
Dec 12 Javascript
JS字符串false转boolean的方法(推荐)
Mar 08 Javascript
深入理解vue-router之keep-alive
Aug 31 Javascript
webpack4.x CommonJS模块化浅析
Nov 09 Javascript
微信小程序动态设置图片大小的方法
Nov 21 Javascript
Vue filter 过滤当前时间 实现实时更新效果
Dec 20 Javascript
JS实现简易日历效果
Jan 25 Javascript
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 面向对象 PHP5 中的常量
2010/05/05 PHP
分享PHP header函数使用教程
2013/09/05 PHP
PHP使用Nginx实现反向代理
2017/09/20 PHP
javascript 弹出窗口中是否显示地址栏的实现代码
2011/04/14 Javascript
Javascript中对象继承的实现小例
2014/05/12 Javascript
NodeJS学习笔记之(Url,QueryString,Path)模块
2015/01/13 NodeJs
在父页面得到zTree已选中的节点的方法
2015/02/12 Javascript
jquery UI Datepicker时间控件的使用方法(基础版)
2015/11/07 Javascript
javascript高级编程之函数表达式 递归和闭包函数
2015/11/29 Javascript
jquery实现瀑布流效果 jquery下拉加载新数据
2016/12/12 Javascript
微信小程序 setData使用方法及常用错误解决办法
2017/05/11 Javascript
JS图片预加载插件详解
2017/06/21 Javascript
webpack使用 babel-loader 转换 ES6代码示例
2017/08/21 Javascript
React如何将组件渲染到指定DOM节点详解
2017/09/08 Javascript
浅谈vue的iview列表table render函数设置DOM属性值的方法
2017/09/30 Javascript
swiper 解决动态加载数据滑动失效的问题
2018/02/26 Javascript
vuex实现的简单购物车功能示例
2019/02/13 Javascript
如何区分vue中的v-show 与 v-if
2020/09/08 Javascript
微信小程序中target和currentTarget的区别小结
2020/11/06 Javascript
Python深入学习之闭包
2014/08/31 Python
python实现多线程抓取知乎用户
2016/12/12 Python
python获取当前目录路径和上级路径的实例
2018/04/26 Python
Python 运行 shell 获取输出结果的实例
2019/01/07 Python
python命令行工具Click快速掌握
2019/07/04 Python
Python将文字转成语音并读出来的实例详解
2019/07/15 Python
Python帮你微信头像任意添加装饰别再@微信官方了
2019/09/25 Python
Python双链表原理与实现方法详解
2020/02/22 Python
Ootori在线按摩椅店:一家专业的按摩椅制造商
2019/04/10 全球购物
ESDlife健康生活易:身体检查预订、搜寻及比较
2019/05/10 全球购物
三年级数学教学反思
2014/01/31 职场文书
十八届三中全会学习方案
2014/02/16 职场文书
《水浒传》读后感3篇(范文)
2019/09/19 职场文书
golang switch语句的灵活写法介绍
2021/05/06 Golang
Python中文纠错的简单实现
2021/07/07 Python
python机器学习Github已达8.9Kstars模型解释器LIME
2021/11/23 Python
python如何利用cv2.rectangle()绘制矩形框
2022/12/24 Python