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的ajax获取数据后的处理总结(html,xml,json)
Jul 14 Javascript
JavaScript初学者应注意的七个细节小结
Jan 30 Javascript
js实现图片和链接文字同步切换特效的方法
Feb 20 Javascript
Javascript中typeof 用法小结
May 12 Javascript
JSP基于Bootstrap分页显示实例解析
Jun 12 Javascript
node.js Sequelize实现单实例字段或批量自增、自减
Dec 08 Javascript
利用HTML5+Socket.io实现摇一摇控制PC端歌曲切换
Jan 13 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
详解一个基于react+webpack的多页面应用配置
Jan 21 Javascript
微信小程序云开发如何使用云函数生成二维码
May 18 Javascript
vue 移动端注入骨架屏的配置方法
Jun 25 Javascript
微信小程序实现图片选择并预览功能
Jul 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开发需要注意的安全问题
2010/09/01 PHP
基于php-fpm的配置详解
2013/06/03 PHP
javascript延时重复执行函数 lLoopRun.js
2007/06/29 Javascript
理解JavaScript变量作用域更轻松
2009/10/25 Javascript
JavaScript 对象模型 执行模型
2010/10/15 Javascript
js调试系列 断点与动态调试[基础篇]
2014/06/18 Javascript
推荐一个封装好的getElementsByClassName方法
2014/12/02 Javascript
node.js中的fs.fchown方法使用说明
2014/12/16 Javascript
javascript作用域、作用域链(菜鸟必看)
2016/06/16 Javascript
老生常谈jquery id选择器和class选择器的区别
2017/02/12 Javascript
Mac中安装nvm的教程分享
2017/12/11 Javascript
Vue不能检测到Object/Array更新的情况的解决
2018/06/26 Javascript
Vue源码解析之Template转化为AST的实现方法
2018/12/14 Javascript
vue-cli3 从搭建到优化的详细步骤
2019/01/20 Javascript
JavaScript实现多层颜色选项卡嵌套
2020/09/21 Javascript
微信小程序入门之指南针
2020/10/22 Javascript
python 运算符 供重载参考
2009/06/11 Python
编写Python脚本来实现最简单的FTP下载的教程
2015/05/04 Python
python虚拟环境的安装配置图文教程
2017/10/20 Python
Python实现定制自动化业务流量报表周报功能【XlsxWriter模块】
2019/03/11 Python
Python OpenCV实现视频分帧
2019/06/01 Python
Python利用逻辑回归分类实现模板
2020/02/15 Python
Python2 与Python3的版本区别实例分析
2020/03/30 Python
没编程基础可以学python吗
2020/06/17 Python
PyTorch安装与基本使用详解
2020/08/31 Python
html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例
2014/05/08 HTML / CSS
Hammitt官网:设计师手袋
2020/05/23 全球购物
在浏览器端如何得到服务器端响应的XML数据
2012/11/24 面试题
程序员经常用到的UNIX命令
2015/04/13 面试题
材料化学应届生求职信
2013/10/09 职场文书
留学自荐信写作方法
2014/01/27 职场文书
业务总经理岗位职责
2014/02/03 职场文书
团委竞选演讲稿
2014/04/24 职场文书
社区综治宣传月活动总结
2014/07/02 职场文书
搞笑婚庆主持词
2015/06/29 职场文书
村官2015年度工作总结
2015/10/14 职场文书