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 相关文章推荐
JavaScript Sort 表格排序
Oct 31 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
Nov 26 Javascript
基于jQuery+JSON的省市二三级联动效果
Jun 05 Javascript
jquery动态导航插件dynamicNav用法实例分析
Sep 06 Javascript
微信小程序 Template详解及简单实例
Jan 05 Javascript
Javascript中return的使用与闭包详解
Jan 11 Javascript
ionic2 tabs 图标自定义实例
Mar 08 Javascript
vue.js源代码core scedule.js学习笔记
Jul 03 Javascript
JavaScript累加、迭代、穷举、递归等常用算法实例小结
May 08 Javascript
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 jQuery
ElementUI radio组件选中小改造
Aug 12 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
Nov 14 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 函数中使用static的说明
2012/06/01 PHP
PHP执行批量mysql语句的解决方法
2013/05/02 PHP
用JavaScript编写COM组件的步骤
2009/03/17 Javascript
再谈javascript原型继承
2014/11/10 Javascript
node.js中实现同步操作的3种实现方法
2014/12/05 Javascript
异步JavaScript编程中的Promise使用方法
2015/07/28 Javascript
浅析ES6的八进制与二进制整数字面量
2016/08/30 Javascript
js滚轮事件兼容性问题需要注意哪些
2016/11/15 Javascript
vue实现app页面切换动画效果实例
2017/05/23 Javascript
Node.js中 __dirname 的使用介绍
2017/06/19 Javascript
JS实现多张图片预览同步上传功能
2017/06/23 Javascript
angularJS开发注意事项
2018/05/26 Javascript
送你43道JS面试题(收藏)
2019/06/17 Javascript
Vue3 源码导读(推荐)
2019/10/14 Javascript
layui实现给某一列加点击事件
2019/10/26 Javascript
在node环境下parse Smarty模板的使用示例代码
2019/11/15 Javascript
js实现文字头像的生成代码
2020/03/07 Javascript
Vue如何实现验证码输入交互
2020/12/07 Vue.js
python列表的常用操作方法小结
2016/05/21 Python
Python实现二维数组按照某行或列排序的方法【numpy lexsort】
2017/09/22 Python
python网络爬虫之如何伪装逃过反爬虫程序的方法
2017/11/23 Python
Python简易计算器制作方法代码详解
2019/10/31 Python
python logging.info在终端没输出的解决
2020/05/12 Python
selenium+超级鹰实现模拟登录12306
2021/01/24 Python
html5 跨文档消息传输示例探讨
2013/04/01 HTML / CSS
html5使用canvas压缩图片的示例代码
2018/09/11 HTML / CSS
韩国流行时尚女装网站:Dintchina(中文)
2018/07/19 全球购物
FLOS美国官网:意大利高级照明工艺的传奇
2018/08/07 全球购物
委托书模板
2014/04/04 职场文书
团队口号大全
2014/06/06 职场文书
2015年房地产销售工作总结
2015/04/20 职场文书
公司年会开场白
2015/06/01 职场文书
六五普法心得体会2016
2016/01/21 职场文书
初中语文教学反思范文
2016/03/03 职场文书
创业计划书之校园跑腿公司
2019/09/24 职场文书
react合成事件与原生事件的相关理解
2021/05/13 Javascript