主要思路就是：返回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. RAID阵列的初始化与管理

    如果我们创建RAID阵列的目的是新部署一台服务器,我们建议所有新创建的RAID阵列都应该做初始化操作,这样,硬盘上原有的用户数据将被清除,以便进行后续的系统,软件安装. 转自: http://zh.c ...

  2. HDU5072 容斥原理

    G - Coprime Time Limit:1000MS     Memory Limit:262144KB     64bit IO Format:%I64d & %I64u Submit ...

  3. 一个程序中关于多个osgGA::GUIEventHandler同时存在的问题

    平时使用GUIEventHandler不太注意handle()函数的返回值,觉得返回true或者false都无所谓,其实不然. 我遇到的问题是程序中一个节点添加了GUIEventHandler对象pi ...

  4. oracle通过plsql导入dmp数据文件

    首先安装Oracle,新建一个空的数据库mydb 从开始菜单运行cmd控制台:sqlplus "用户名/密码@数据库名 as sysdba"//例如sqlplus sys/admi ...

  5. java中String类型转换方法

    integer to String : int i = 42;String str = Integer.toString(i);orString str = "" + i doub ...

  6. Car的旅行路线（codevs 1041）

    题目描述 Description 又到暑假了,住在城市A的Car想和朋友一起去城市B旅游.她知道每个城市都有四个飞机场,分别位于一个矩形的四个顶点上,同一个城市中两个机场之间有一条笔直的高速铁路,第I ...

  7. 侃侃前端MVC设计模式

    前言 前端的MVC,近几年一直很火,大家也都纷纷讨论着,于是乎,抽空总结一下这个知识点.看了些文章,结合实践略作总结并发表一下自己的看法. 最初接触MVC是后端Java的MVC架构,用一张图来表示之— ...

  8. Java使用代理Proxy访问网络及其验证

    在Java的网络编程中,有时候内网服务器需要访问外网的网络资源,这时候就需要使用代理. 设置代理(Proxy)可以有两种方式: 1.通过设置系统属性(System.setPropery(String ...

  9. C#学习笔记——Show()与ShowDialog()的区别

    用Show()调用的窗体不会返回任何值,在使用form.Show()显示form以后,会马上继续执行form.Show()后面的语句.而用ShowDialog()调用的窗体会返回一个DialogRes ...

  10. 蒟蒻的树形dp记录

    POJ2342: 题意:某公司要举办一次晚会,但是为了使得晚会的气氛更加活跃,每个参加晚会的人都不希望在晚会中见到他的直接上司,现在已知每个人的活跃指数和上司关系(当然不可能存在环),求邀请哪些人(多 ...