使用JavaScript链式编程实现模拟Jquery函数


Posted in Javascript onDecember 21, 2014

代码很简单,主要是给大家提供个思路,也算是学习javascript这么长时间的一个小小的练手。

链式编程 是将多个操作(多行代码)通过点号"."链接在一起成为一句代码。链式代码通常要求操作有返回值,但对于很多操作大都是void型,什么也不返回,这样就很难链起来了,当然也有解决办法,可能不太优雅。链式编程的新思想在jQuery中已流行使用

<span>Hello,World!</span>

 <script type="text/javascript">

     Jq = function (tagName) {

         var tagArr = document.getElementsByTagName(tagName);

         var ret = {

             tag: tagArr,

             css: function (attribute, value) {

                 for (var i = 0; i < this.tag.length; i++) {

                     this.tag[i].style[attribute] = value;

                 }

                 return this;

             }

         }

         return ret;

     }

     window.onload = function () {

         Jq("span").css("color", "red")

                   .css("border", "1px solid green")

                   .css("padding", "10px");

     }

 </script>

有意问的话,就留言,大家共同进步

Javascript 相关文章推荐
js window.onload 加载多个函数的方法
Nov 02 Javascript
js中巧用cssText属性批量操作样式
Mar 13 Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
Jan 26 Javascript
jquery实现省市select下拉框的替换(示例代码)
Feb 22 Javascript
使用typeof方法判断undefined类型
Sep 09 Javascript
JS实现淡蓝色简洁竖向Tab点击切换效果
Oct 06 Javascript
JQuery实现网页右侧随动广告特效
Jan 17 Javascript
jQuery实现的分页功能示例
Jan 22 Javascript
SeaJS中use函数用法实例分析
Oct 10 Javascript
JS中的多态实例详解
Oct 15 Javascript
vue.js 实现点击展开收起动画效果
Jul 07 Javascript
利用 JavaScript 实现并发控制的示例代码
Dec 31 Javascript
使用jQuery简单实现模拟浏览器搜索功能
Dec 21 #Javascript
编写简单的jQuery提示插件
Dec 21 #Javascript
不使用ajax实现无刷新提交表单
Dec 21 #Javascript
webapp框架AngularUI的demo改造之路
Dec 21 #Javascript
浅析webapp框架AngularUI的demo
Dec 21 #Javascript
AngularJS基础知识
Dec 21 #Javascript
javascript关于继承的用法汇总
Dec 20 #Javascript
You might like
第三节--定义一个类
2006/11/16 PHP
可定制的PHP缩略图生成程式(需要GD库支持)
2007/03/06 PHP
php使用filter过滤器验证邮箱 ipv6地址 url验证
2013/12/25 PHP
C/S和B/S两种架构区别与优缺点分析
2014/10/23 PHP
php生成mysql的数据字典
2016/07/07 PHP
Thinkphp5.0 框架使用模型Model添加、更新、删除数据操作详解
2019/10/11 PHP
javascript获取设置div的高度和宽度兼容任何浏览器
2013/09/22 Javascript
JS获取浏览器语言动态加载JS文件示例代码
2014/10/31 Javascript
jQuery无刷新分页完整实例代码
2015/10/27 Javascript
js闭包引起的事件注册问题介绍
2016/03/29 Javascript
Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定示例
2017/01/22 Javascript
ES6新特性之字符串的扩展实例分析
2017/04/01 Javascript
Express框架之connect-flash详解
2017/05/31 Javascript
荐书|您有一份JavaScript书单待签收
2017/07/21 Javascript
JavaScript数组及常见操作方法小结
2019/11/13 Javascript
详解vue-flickity的fullScreen功能实现
2020/04/07 Javascript
vue+Element中table表格实现可编辑(select下拉框)
2020/05/21 Javascript
Python+MongoDB自增键值的简单实现
2016/11/04 Python
Python之os操作方法(详解)
2017/06/15 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
微信跳一跳python自动代码解读1.0
2018/01/12 Python
Python实现将数据框数据写入mongodb及mysql数据库的方法
2018/04/02 Python
python程序封装为win32服务的方法
2021/03/07 Python
jupyter notebook 增加kernel教程
2020/04/10 Python
纯CSS3制作页面切换效果的实例代码
2019/05/30 HTML / CSS
js实现移动端H5页面手指滑动刻度尺功能
2017/11/16 HTML / CSS
伦敦著名的运动鞋综合商店:Footpatrol
2019/03/25 全球购物
Foot Locker澳洲官网:美国运动服和鞋类零售商
2019/10/11 全球购物
办公室助理岗位职责
2013/12/25 职场文书
会计工作决心书
2014/03/11 职场文书
优秀团员事迹材料1000字
2014/08/20 职场文书
法定代表人授权委托书范文
2014/09/22 职场文书
简易离婚协议书范本
2014/10/24 职场文书
结婚典礼致辞
2015/07/28 职场文书
SpringCloud Alibaba 基本开发框架搭建过程
2021/06/13 Java/Android
前端vue+express实现文件的上传下载示例
2022/02/18 Vue.js