使用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 focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
js身份证判断方法支持15位和18位
Mar 18 Javascript
JavaScript  cookie 跨域访问之广告推广
Apr 20 Javascript
浅谈JS使用[ ]来访问对象属性
Sep 21 Javascript
JS中用childNodes获取子元素换行会产生一个子元素
Dec 08 Javascript
关于react-router的几种配置方式详解
Jul 24 Javascript
基于Vue生产环境部署详解
Sep 15 Javascript
webpack构建换肤功能的思路详解
Nov 27 Javascript
JS设计模式之命令模式概念与用法分析
Feb 06 Javascript
详解JavaScript 中 if / if...else...替换方式
Jul 15 Javascript
Vue项目路由刷新的实现代码
Apr 17 Javascript
vue自定义正在加载动画的例子
Nov 14 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
php.ini修改php上传文件大小限制的方法详解
2013/06/17 PHP
PHP ignore_user_abort函数详细介绍和使用实例
2014/07/15 PHP
THINKPHP项目开发中的日志记录实例分析
2014/12/01 PHP
php压缩文件夹最新版
2018/07/18 PHP
通过JAVASCRIPT读取ASP设定的COOKIE
2006/11/24 Javascript
学习js所必须要知道的一些
2007/03/07 Javascript
不用MOUSEMOVE也能滑动啊
2007/05/23 Javascript
jquery实现图片左右间隔滚动特效(可自动播放)
2013/05/08 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
jquery实现select下拉框美化特效代码分享
2015/08/18 Javascript
javascript每日必学之封装
2016/02/23 Javascript
AngularJS入门教程之过滤器详解
2016/08/19 Javascript
JS制作适用于手机和电脑的通知信息效果
2016/10/28 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
2016/10/30 Javascript
ES6中Generator与异步操作实例分析
2017/03/31 Javascript
Vue自定义指令详解
2017/07/28 Javascript
vue 实现的树形菜的实例代码
2018/03/19 Javascript
vue源码解析之事件机制原理
2018/04/21 Javascript
NodeJs搭建本地服务器之使用手机访问的实例讲解
2018/05/12 NodeJs
AngularJS实现动态切换样式的方法分析
2018/06/26 Javascript
详解微信图片防盗链“此图片来自微信公众平台 未经允许不得引用”的解决方案
2019/04/04 Javascript
详解vue为什么要求组件模板只能有一个根元素
2019/07/22 Javascript
JavaScript console的使用方法实例分析
2020/04/28 Javascript
编写Python脚本来获取mp3文件tag信息的教程
2015/05/04 Python
Python获取linux主机ip的简单实现方法
2016/04/18 Python
opencv调整图像亮度对比度的示例代码
2019/09/27 Python
python 实现图片上传接口开发 并生成可以访问的图片url
2019/12/18 Python
Python读取配置文件(config.ini)以及写入配置文件
2020/04/08 Python
波兰家居饰品和厨房配件网上商店:Maleomi
2020/12/15 全球购物
酒店服务实习自我鉴定
2013/09/22 职场文书
经典婚礼主持开场白
2014/03/13 职场文书
团结就是力量演讲稿
2014/05/21 职场文书
工作求职自荐信
2014/06/13 职场文书
大学生团日活动总结
2015/05/06 职场文书
2016新年年会主持词
2015/07/06 职场文书
python使用tkinter实现透明窗体上绘制随机出现的小球(实例代码)
2021/05/17 Python