<!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. 洛谷P1108 低价购买[DP | LIS方案数]

    题目描述 “低价购买”这条建议是在奶牛股票市场取得成功的一半规则.要想被认为是伟大的投资者,你必须遵循以下的问题建议:“低价购买:再低价购买”.每次你购买一支股票,你必须用低于你上次购买它的价格购买它 ...

  2. kettle运行spoon.bat时找不到javaw文件

    我也遇到这问题了,分享一下解决方法吧以后没准还有人能用到.我机器的主要问题是环境变量JAVA_HOME的值不对,应该写到jdk也就是C:\Program Files\Java\jdk1.7.0_25, ...

  3. iOS Webview 实现修改javascript confirm 和 alert

    贴代码: @interface UIWebView (JavaScriptAlert) -(void) webView:(UIWebView *)sender runJavaScriptAlertPa ...

  4. jquery easyui 1.4.1 验证时tooltip 的位置调整

    现象是在表单中如果显示两列控件,右边的控件是combo,combobox 等右边有按钮的,宽度为100%时,验证不通过的tooltip 显示位置不准确如下图所示 打开 jquery.easyui-1. ...

  5. 2748: [HAOI2012]音量调节 bzoj

    Description 一个吉他手准备参加一场演出.他不喜欢在演出时始终使用同一个音量,所以他决定每一首歌之前他都要改变一次音量.在演出开始之前,他已经做好了一个列表,里面写着在每首歌开始之前他想要改 ...

  6. word中方框中打钩

    之前一致认为,方框打钩不可能的.今天要交评测,结果百度一下,发现可以打钩的!不会就百度(Google)真的不会错的,你所 疑虑的,可能前人已经找到解决方法!!! 解决方法:     alt+9745

  7. 为什么 "auto a = 1;" 在C语言中可以编译通过？

    参照:这里 这让我想起之前看的一部书, int i; 其实是等价与 auto int i; 表示为局部变量 这应该与static是相对的吧?

  8. WebView·开发指南

    WebView·开车指南 作者:凌俊琦链接:https://zhuanlan.zhihu.com/p/22247021来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. T ...

  9. css-display:none和visibility：hidden的不同

    摘自张鑫旭老师的博客-- display:none和visibility:hidden都能使元素隐藏,但是有明显区别,主要有以下三点: 空间占据 重排与重绘 株连性 1.空间占据. 使用display ...

  10. 2次使用fork避免产生僵尸进程和不去处理SIGCHLD信号

    1.如下代码所示 #include <unistd.h> #include <sys/types.h> #include <unistd.h> int main(i ...