<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>
<input type="text" id="content">
<button type="button" id="btn">click</button>
</div>
<script>
window.onload = function(){
var oContent = document.getElementById('content');
var oBtn = document.getElementById('btn');

var SayHello = function(){
this.content = '';
};
SayHello.prototype = {
SayMorning: function(){
this.content += 'good morning';

//每次调用返回this也就是调用函数的对象
return this;
},
SayNight: function(){
this.content += 'good night';
return this;
}
}

oBtn.addEventListener('click', function(){
var sayhello = new SayHello();

//在这里地阿姨那个SayMorning之后返回了调用对象sayhello 
sayhello.SayMorning().SayNight();//这里相当于sayhello.SayMorning(),sayhello.SayNight();
oContent.value = sayhello.content;
},false);
}
</script>
</body>
</html>

用原生js实现的链式调用函数的更多相关文章

  1. 原生JS数组操作的6个函数 arr.forEach arr.map arr.filter arr.some arr.every arr.findIndex

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. Javscript的函数链式调用基础篇

    我们都很熟悉jQuery了,只能jQuery中一种非常牛逼的写法叫链式操作: $('#div').css('background','#ccc').removeClass('box').stop(). ...

  3. 原生js仿jquery一些常用方法

    原生js仿jquery一些常用方法 下面小编就为大家带来一篇原生js仿jquery一些常用方法(必看篇).小编觉得挺不错的,现在就分享给大家,也给大家做个参考.一起跟随小编过来看看吧   最近迷上了原 ...

  4. 原生JS封装创建多级菜单函数

    手写一个使用原生JS封装的多级菜单的函数,满足以下几点需求. 子类层级不确定,可根据数据自动生成多级菜单. 操作便捷,只需传入一个HTML标签. 缺点: 需要满足特定的数据结构 废话不多说,展示代码. ...

  5. JS的作用域链与this指向

    JS的作用域链是在函数创建时创建的.而this对象是在函数运行期间绑定的. 下面看几个例子,说明JS的作用域链和this是两套分离的链. 1) var name = 'window下的name< ...

  6. 如何写 JS 的链式调用 ---》JS 设计模式《----方法的链式调用

    1.以$ 函数为例.通常返回一个HTML元素或一个元素集合. 代码如下: function $(){ var elements = []; ;i<arguments.length;i++){ v ...

  7. 原生JS实现jquery的链式编程。

    这是我根据之前遇到的一个面试题,题目:用原生JS实现$("#ct").on("click",fn).attr("id"). 然后看了篇jqu ...

  8. [js高手之路] 设计模式系列课程 - jQuery的链式调用与灵活的构造函数

    一.我们从一个简单的构造函数+原型程序开始 var G = function(){}; G.prototype = { length : 5, size : function(){ return th ...

  9. js链式调用 柯里化

    var d = 1; d.add(2).add(3).add(4) //输出10 写出这个add函数 Number.prototype.add = function(x){ return this + ...

随机推荐

  1. 第一次打开Lightroom时的基本设置

    [声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/5 ...

  2. angular监听

    监听中第三个参数,何时使用true? true的意思是“深度监听” 1.当监听对象属性变化时,而你监听的对象写得是对象,此时要用深度监听true: 2....... 监听耗资源,用完关闭 var wa ...

  3. 关于ipa和apk文件的解压

    移动互联网中,主要的两个平台是Android和ios,android上文件的安装包是后缀名为apk的文件,ios上文件的安装包是后缀名为ipa的文件,在本文分析一下这两种文件的特点,以及如何用程序去解 ...

  4. 对 Python 语法不够了解导致的 bug

    对 Python 语法不够了解导致的 bug. `in` '20' in '11264,6144,4096,3072,2048,1024,300,30' Out[7]: True a_list = ' ...

  5. JQUERY获取当前页面的URL信息

    以前在做网站的时候,经常会遇到当前页的分类高亮显示,以便让用户了解当前处于哪个页面.之前一直是在每个不 同页面写方法.工程量大,也不便于修改.一直在想有什么简便的方法实现.后来在网上查到可以用获取当前 ...

  6. 搭建TFS 2015 Build Agent环境(二)

    在执行和安装配置的过程中,注意一定要使用管理员权限运行:ConfigureAgent.cmd 和RunAgent.cmd.配置的过程中,要注意几个内容:1.TFS地址不要写DefaultCollect ...

  7. VS2012的调试插件Image Watch，opencv编程神器

    今天配置 opencv3.0 时无意中看到 Image Watch 这样一个VS2012的调试插件,适用了下,特别好用. 部分链接: Image Watch 的 下载链接 OpenCV关于ImageW ...

  8. linux基础知识与技能1

    1.隐藏文件与非隐藏文件Linux中:linux中隐藏文件特点是文件名以.开头,跟文件属性无关.在linux中查看隐藏文件用ls -a命令(普通显示ls)2.相对路径与绝对路径什么是路径:路径是用来标 ...

  9. 随堂软工团队小测——git协同

    No Bug 031402401鲍亮 031402402曹鑫杰 031402403常松 031402412林淋 031402418汪培侨 031402426许秋鑫 功能模块划分 方法 功能 main( ...

  10. jeecg单步调试

    自己没本事写开发平台,用别人的又各种担心,想学着别人弄个单步调试,老是出现这个"source not found"-- 百度各种方法都搞不定,担心是自己安装错了?这个jeecg本身 ...