使用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 相关文章推荐
有趣的javascript数组定义方法
Sep 10 Javascript
JavaScript中对象介绍
Dec 31 Javascript
js正则表达式匹配数字字母下划线等
Apr 14 Javascript
浅谈JavaScript 的执行顺序
Aug 07 Javascript
Javascript将数字转化成为货币格式字符串
Jun 22 Javascript
在vue.js中抽出公共代码的方法示例
Jun 08 Javascript
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
Mar 28 jQuery
JS函数内部属性之arguments和this实例解析
Oct 07 Javascript
js实现通过开始结束控制的计时器
Feb 25 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
Oct 23 Javascript
js获取url页面id,也就是最后的数字文件名
Sep 25 Javascript
基于vue+echarts数据可视化大屏展示的实现
Dec 25 Vue.js
使用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
提取HTML标签
2006/10/09 PHP
可定制的PHP缩略图生成程式(需要GD库支持)
2007/03/06 PHP
linux系统上支持php的 iconv()函数的方法
2011/10/01 PHP
PHP数组 为文章加关键字连接 文章内容自动加链接
2011/12/29 PHP
php中session过期时间设置及session回收机制介绍
2014/05/05 PHP
php封装一个异常的处理类
2017/06/08 PHP
PHP排序算法之冒泡排序(Bubble Sort)实现方法详解
2018/04/20 PHP
PHP实现的curl批量请求操作示例
2018/06/06 PHP
Js+Dhtml:WEB程序员简易开发工具包(预先体验版)
2006/11/07 Javascript
xml分页+ajax请求数据源+dom取结果实例代码
2008/10/31 Javascript
jQuery load方法用法集锦
2011/12/06 Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
2013/12/30 Javascript
jquery原创弹出层折叠效果点击折叠弹出一个层
2014/03/12 Javascript
Javascript中使用parseInt函数需要注意的问题
2015/04/02 Javascript
iPhone手机上搭建nodejs服务器步骤方法
2015/07/06 NodeJs
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
sea.js常用的api简易文档
2016/11/15 Javascript
JS实现的图片预览插件与用法示例【不上传图片】
2016/11/25 Javascript
微信小程序 引入es6 promise
2017/04/12 Javascript
Node.js使用Angular简单示例
2018/05/11 Javascript
基于Echarts图表在div动态切换时不显示的解决方式
2020/07/20 Javascript
何时/使用 Vue3 render 函数的教程详解
2020/07/25 Javascript
python自动安装pip
2014/04/24 Python
Python模拟百度登录实例详解
2016/01/20 Python
Python 从一个文件中调用另一个文件的类方法
2019/01/10 Python
Python面向对象程序设计示例小结
2019/01/30 Python
Python实现的旋转数组功能算法示例
2019/02/23 Python
10行Python代码计算汽车数量的实现方法
2019/10/23 Python
使用html5新特性轻松监听任何App自带返回键的示例
2018/03/13 HTML / CSS
美国著名的品牌折扣店:Burlington
2017/06/08 全球购物
学子宴答谢词
2014/01/25 职场文书
法律进机关实施方案
2014/03/12 职场文书
刑事辩护授权委托书
2014/09/13 职场文书
开平碉楼导游词
2015/02/06 职场文书
基于Pygame实现简单的贪吃蛇游戏
2021/12/06 Python
Spring Boot 的创建和运行示例代码详解
2022/07/23 Java/Android