主要思路就是：返回this对象，将所获取的操作元素放入一个数组中。在原型中添加拓展方法

<html>

<head>

	<title></title>

</head>

<body>

	<div id="one">aa</div>

</body>

<script type="text/javascript">

//封装类似于JQuery的连缀

/*

思路：一个操作后再返回本来的对象this，将获取的元素放入一个数组内部。通过原型添加方法;

为了能在原型对象中添加方法；这个应该用函数来建立原型对象

function Base(){

	this.getId=function(id){

		return this;

	}

	使用的时候，需要new一个实例对象

	var newBase=Base（）；

}

*/

function Base(){

	this.element=[];

	//获取ID

	this.getId=function(id){

		//将所获取的元素放入数组里面，返回当前对象

			this.element.push(document.getElementById(id))

			// return this.element.length

			return this

		}

		//获取className，遍历push

		this.getClass=function(name){

			var names=document.getElementsByName(name);

			for( var i=0;i<names.length;i++){

				this.element.push(names[i])

			}

			return this;

		}

		//获取tagName；遍历push

		this.getTag=function(tags){

			var tags=document.getElementsByTagName(tags);

			for(var i=0;i<tags.length;i++){

				this.element.push(tags[i])

			}

			return this;

		}

	}

//通过原型添加方法：

Base.prototype.css=function(attr,value){

	//遍历选取当前元素

	for(var i=0;i<this.element.length;i++){

		this.element[i].style[attr]=value;

	}

	return this;

}

var newBase= new Base();

// alert(newBase.getId("one"))

newBase.getId("one").css("background","red").css("color","blue").css("fontSize","60")

</script>

</html>

　　

像jQuery那样，采用链式方法，封装一个方法：CSS（）的更多相关文章

  1. JQuery事件的链式写法

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. jQuery 筛选器 链式编程操作

    $('#i1').next() 下一个标签$('#i1').nextAll() 兄弟标签中,所有下一个标签$('#i1').nextUntil('#ii1') 兄弟标签中,从下一个标签到id为ii1的 ...

  3. 从零开始学 Web 之 jQuery（三）元素操作，链式编程，动画方法

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  4. php类自动装载、链式操作、魔术方法

    1.自动装载实例 目录下有3个文件:index.php load.php tests文件夹 tests文件夹里有 test1.php <?php namespace Tests; class T ...

  5. jquery初级接触-----链式操作

    设置一个初级菜单,点击显示本级菜单下的项目,被点击的同级其它菜单收起 html 代码: <!DOCTYPE html> <html lang="en"> & ...

  6. jQuery对象的链式操作用法分析

    可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...

  7. Tarjan模版（链式向前星表示方法）

    这道模版用到了链式向前星表示法: struct node { int v,next; }edge[]; void add(int x,int y) { edge[++cnt].next=heads[x ...

  8. egg项目eslint不识别链式操作符的解决方法

    项目用到链式?.结果eslint一直提示 const permissionHandleArr = positionPermissionHandle.map(item => item.permis ...

  9. java开发中的链式思维 —— 设计一个链式过滤器

    概述 最近在弄阿里云的sls日志服务,该服务提供了一个搜索接口,可根据各种运算.逻辑等表达式搜出想要的内容.具体语法可见https://help.aliyun.com/document_detail/ ...

随机推荐

  1. Quartz作业调度框架

    Quartz 是一个开源的作业调度框架,它完全由 Java 写成,并设计用于 J2SE 和 J2EE 应用中.它提供了巨大的灵活性而不牺牲简单性.你能够用它来为执行一个作业而创建简单的或复杂的调度.本 ...

  2. 【leetcode】Sudoku Solver

    Sudoku Solver Write a program to solve a Sudoku puzzle by filling the empty cells. Empty cells are i ...

  3. 61. 从1到n，共有n个数字，每个数字只出现一次。从中随机拿走一个数字x，请给出最快的方法，找到这个数字。如果随机拿走k(k>=2)个数字呢？[find k missing numbers from 1 to n]

    [本文链接] http://www.cnblogs.com/hellogiser/p/find-k-missing-numbers-from-1-to-n.html  [题目] 从1到n,共有n个数字 ...

  4. ndk编译protobuf库

    ndk_r9编译通过,里面带了自动生成代码的脚本(tool/createPBFile.bat). 下载地址

  5. KBS2 SBS MBC 高清播放地址 + mplayer 播放 录制

    网页flash播放KBS2 SBS MBC时占CPU资源太高,为了解决这个问题可以使用 mplayer播放器直接播放,还可以录制. 播放命令 mplayer http://pull.kktv8.com ...

  6. 【JAVA、C++】LeetCode 019 Remove Nth Node From End of List

    Given a linked list, remove the nth node from the end of list and return its head. For example, Give ...

  7. Greedy:Stall Reservations(POJ 3190)

    牛挤奶 题目大意:一群牛很挑剔,他们仅在一个时间段内挤奶,而且只能在一个棚里面挤,不能与其他牛共享地方,现在给你一群牛,问你如果要全部牛都挤奶,至少需要多少牛棚? 这一题如果把时间区间去掉,那就变成装 ...

  8. Fence Repair（poj 3253）

    题意: 有一个农夫要把一个木板钜成几块给定长度的小木板,每次锯都要收取一定费用,这个费用就是当前锯的这个木版的长度 给定各个要求的小木板的长度,及小木板的个数n,求最小费用 提示: 以 3 5 8 5 ...

  9. 【Android 进阶】临时卸载root和恢复root功能

    [前言]为什么有这个需求? Q:首先,谈谈为啥想要root呢? A:有root才能有控制权,也才能折腾很多东西,比如:删删流氓软件,用用代理.软件自动安装等: Q:然后,那么为何又需要删除root呢? ...

  10. Java Hour6

    有句名言,叫做10000小时成为某一个领域的专家.姑且不辩论这句话是否正确,让我们到达10000小时的时候再回头来看吧. 本文作者Java 现经验约为5 Hour,请各位不吝赐教. Hour6 Jav ...