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

 更新时间:2014年12月21日 16:44:09   投稿:hebedich  
这篇文章主要介绍了使用JavaScript链式编程实现模拟Jquery函数的方法及源码分享,非常的不错,推荐给大家。

代码很简单,主要是给大家提供个思路,也算是学习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必知必会(十) call apply bind的用法说明

    JavaScript必知必会(十) call apply bind的用法说明

    这篇文章主要介绍了JavaScript必知必会(十) call apply bind的用法说明 的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • 深入了解Hybrid App技术的相关知识

    深入了解Hybrid App技术的相关知识

    这篇文章主要介绍了深入了解Hybrid App技术的相关知识,Hybrid App(混合模式移动应用)是指介于web-app、native-app这两者之间的app,兼具" Native App良好用户交互体验的优势 "和" Web App跨平台开发的优势 ",需要的朋友可以参考下
    2019-07-07
  • JS中setTimeout()的用法详解

    JS中setTimeout()的用法详解

    setTimeout( ) 是属于 window 的 method, 但我们都是略去 window 这顶层物件名称, 这是用来设定一个时间, 时间到了, 就会执行一个指定的 method
    2013-04-04
  • JS控制下拉列表左右选择实例代码

    JS控制下拉列表左右选择实例代码

    在本篇内容中小编给各位分享的是关于如何使用JS控制下拉列表左右选择的实例代码,需要的朋友们可以参考下。
    2020-05-05
  • 17道题让你彻底理解JS中的类型转换

    17道题让你彻底理解JS中的类型转换

    这篇文章主要给大家介绍了关于如何通过17道题让你彻底理解JS中的类型转换的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用JS具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-08-08
  • 微信小程序自定义日期选择器

    微信小程序自定义日期选择器

    这篇文章主要为大家详细介绍了微信小程序自定义日期选择器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下<BR>
    2022-01-01
  • JavaScript优化图片懒加载的性能技巧

    JavaScript优化图片懒加载的性能技巧

    前端发展过程中有许多性能优化的操作,比如防抖、节流和图片懒加载等,在这里我们首先聊聊图片懒加载操作,我们会经常逛像淘宝和京东等购物平台,一次性全部加载会导致加载时间长、网络资源消耗大,所以本文给大家介绍了JavaScript优化图片懒加载的性能技巧
    2024-06-06
  • 详解JavaScript的BUG和错误

    详解JavaScript的BUG和错误

    本篇内容给大家总结了JavaScript的BUG和错误,如果大家对此知识点有兴趣,可以跟着学习参考下。
    2018-05-05
  • javascript实现检验的各种规则

    javascript实现检验的各种规则

    这篇文章主要介绍了javascript实现检验的各种规则,涉及javascript针对手机号、邮箱、网址、汉字及图片等相关检测技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-07-07
  • JS实现横向与竖向两个选项卡Tab联动的方法

    JS实现横向与竖向两个选项卡Tab联动的方法

    这篇文章主要介绍了JS实现横向与竖向两个选项卡Tab联动的方法,涉及JavaScript遍历及动态修改页面元素属性的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-09-09

最新评论