修改或扩展jQuery原生方法的代码实例
这篇文章主要介绍了修改或扩展jQuery原生方法的代码实例,本文用一个扩展jquery原生方法val的例子,讲解了如何对jquery原生方法修改或扩展,需要的朋友可以参考下
修改或者扩展jQuery的方法代码实例:
毫无疑问，jQuery是一款功能强大且使用方便的类库。
从它的广泛应用可以证实上面的观点，但是正所谓人无完人，金无足赤，jQuery也是如此，并非在任何时候或者场合都能够完美的完成我们的任务，所以有事以后就需要对jQuery原有的方法进行扩展修改，但是最好方法仍然具有原来的功能。
代码实例:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>php中文网</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>
$.prototype.val = function (base) {
return function () {
var s = this;
var a = "data-property";
var p = s.attr(a);
var isset = arguments.length > 0;
var v = isset ? arguments[0] : null;
if (isset&&typeof(base)=="function") {
base.call(s, v);
}
else {
v = base.call(s);
}
if (p) {
if (isset) {
s.attr(p, v);
return s
}
else {
return s.attr(p)
}
}
else {
if (!s.is(":input")){
if (isset) {
s.text(v); return s;
}
else {
return s.text();
}
}
else {
return isset ? s : v;
}
}
}
}($.prototype.val);
$(document).ready(function(){
$("#show").html($("#lbl").val()+"<br>"+$("#txt").val());
})
</script>
</head>
<body>
<span id="lbl">php中文网</span>
<input type="text" id="txt" value="softwhy.com" />
<input type="checkbox" value="antzone" />
<p id="show"></p>
</body>
</html>上面的代码毫无疑问是对jQuery的val()方法做的扩展，下面介绍一下它的实现过程。
代码注释:
1、$.prototype.val = function (base) {}(($.prototype.val),修改jQuery原来的val()方法，这里采用闭包的方式，传递的参数是原来的val()方法，以保持原来val()方法的功能。
2、return function (){}，返回一个函数对象。
3、var s = this，将this的指向引用赋值给变量s，这里的this是指向jQuery对象实例的。
4、var a = "data-property"，声明一个变量并赋值，关于它的更多内容面会介绍。
5、var p = s.attr(a)，其实data-property就是标签上的一个自定义属性，那么这段代码就是获取此属性值。
6、var isset = arguments.length > 0，判断修改后的val()方法是否传递了参数。
7、var v = isset ? arguments[0] : null，如果传递参数，那么久获取第一个参数，其他的忽略。
8、if (isset&&typeof(base)=="function") { base.call(s, v);}，如果传递了参数，且base参数是一个函数，那么就调用base函数设置元素
以上就是本章的全部内容，更多相关教程请访问jQuery视频教程！
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
AI Hentai Generator
免费生成ai无尽的。
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
钉钉怎么修改群里的个人名称_钉钉修改群里个人名称方法
Mar 29, 2024 pm 08:41 PM
1、首先打开钉钉。2、打开群聊，点击右上角的三个点。3、找到我在本群的昵称。4、点击进入即可修改保存。
抖音蓝V可以改名字吗？企业抖音蓝V号名称修改步骤有哪些？
Mar 22, 2024 pm 12:51 PM
抖音蓝V认证是企业或品牌在抖音平台上的官方认证，有助于提升品牌形象和可信度。随着企业发展战略的调整或品牌形象的更新，企业可能希望更改抖音蓝V认证的名字。那么，抖音蓝V可以改名字吗？答案是可以的。本文将详细介绍企业抖音蓝V号名称修改的步骤。一、抖音蓝V可以改名字吗？抖音蓝V账号是可以改名字的。根据抖音官方规定，企业蓝V认证账号在满足一定条件后，可以申请修改账号名称。一般来说，企业需要提供相关的证明材料，如营业执照、组织机构代码证等，以证明修改名称的合法性和必要性。二、企业抖音蓝V号名称修改步骤有哪
Win10睡眠时间修改技巧大揭秘
Mar 08, 2024 pm 06:39 PM
Win10睡眠时间修改技巧大揭秘作为目前广泛使用的操作系统之一，Windows10拥有睡眠功能，帮助用户在不使用电脑时节省电力并保护屏幕。然而，有时候默认的睡眠时间并不符合用户的需求，因此了解如何修改Win10睡眠时间就显得尤为重要。本文将揭示Win10睡眠时间修改的技巧，让您轻松自定义系统的睡眠设置。一、通过“设置”修改Win10睡眠时间首先，最简单的修
PHP 函数的扩展和第三方模块
Apr 13, 2024 pm 02:12 PM
要扩展PHP函数功能，可以使用扩展和第三方模块。扩展提供附加函数和类，可通过pecl包管理器安装和启用。第三方模块提供特定功能，可通过Composer包管理器安装。实践案例包括使用扩展解析复杂JSON数据和使用模块验证数据。
闲鱼怎么修改已发布商品地址位置
Mar 28, 2024 pm 03:36 PM
在闲鱼平台发布商品时，用户可以根据实际情况自定义设置宝贝的地理位置信息，这样潜在买家就能更精准地掌握商品的具体所在地。一旦商品成功上架，若卖家的地理位置有所变动，也无需担忧。闲鱼平台特别提供了灵活且便捷的修改功能，那么当我们想要修改已经发布产品的地址究竟该如何修改呢，这篇教程攻略就将为大家带来详细的步骤攻略介绍，希望能帮助到大家！闲鱼怎么修改发布产品地址？1、打开闲鱼，点击我发布的，选择商品，点击编辑。2、点击定位图标，选择需要设置的地址即可。
boss直聘怎么修改打招呼内容
Mar 01, 2024 pm 03:40 PM
在boss直聘这款求职招聘软件中，用户可以个性化地设置自己的打招呼语句，以更好地展示自己的个性和求职意愿。但是有的时候默认的打招呼用语比较机械僵硬，很多用户们想要自己的更改却不知道在哪里设置，那么这篇教程攻略就将为大家带来详细修改步骤介绍，想要了解的玩家们就快来跟着本文一起一探究竟吧！boss直聘打招呼的话怎么改答案：【boss直聘】-【我的】-【设置图标】-【打招呼语】。具体步骤：1、首先我们点击boss直聘软件，进入到首页中后我们点击右下角的【我的】;2、然后来到我的页面中后可以看到相关的数
Go语言编程指南：修改hosts文件的实现
Mar 07, 2024 am 10:51 AM
标题：Go语言编程指南：修改hosts文件的实现在日常的软件开发过程中，经常会遇到需要修改操作系统中hosts文件的情况。Hosts文件是一个没有扩展名的用于映射IP地址和主机名的文本文件，通常用于在本地设置域名解析。在本文中，将介绍如何使用Go语言来实现修改操作系统hosts文件的功能，并给出具体的代码示例。首先，我们需要创建一个可以修改hosts文件的G
PHP 函数返回值的类型与 PHP 扩展的互操作性有什么关系？
Apr 15, 2024 pm 09:06 PM
PHP函数返回值类型可表示为类型说明语法，明确指定了各函数的返回值类型。了解返回值类型对于创建与PHP核心引擎兼容的扩展至关重要，可避免意外转换、提高效率和增强代码可读性。具体而言，扩展函数可定义返回值类型，以便PHP引擎根据该类型优化代码执行，并让开发者明确处理返回值。实践中，扩展函数可以返回PHP对象，而PHP代码可以根据返回值类型处理返回的结果。
