像jQuery那样，采用链式方法，封装一个方法：CSS（）
主要思路就是：返回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（）的更多相关文章
- JQuery事件的链式写法
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- jQuery 筛选器 链式编程操作
$('#i1').next() 下一个标签$('#i1').nextAll() 兄弟标签中,所有下一个标签$('#i1').nextUntil('#ii1') 兄弟标签中,从下一个标签到id为ii1的 ...
- 从零开始学 Web 之 jQuery（三）元素操作，链式编程，动画方法
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- php类自动装载、链式操作、魔术方法
1.自动装载实例 目录下有3个文件:index.php load.php tests文件夹 tests文件夹里有 test1.php <?php namespace Tests; class T ...
- jquery初级接触-----链式操作
设置一个初级菜单,点击显示本级菜单下的项目,被点击的同级其它菜单收起 html 代码: <!DOCTYPE html> <html lang="en"> & ...
- jQuery对象的链式操作用法分析
可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...
- Tarjan模版（链式向前星表示方法）
这道模版用到了链式向前星表示法: struct node { int v,next; }edge[]; void add(int x,int y) { edge[++cnt].next=heads[x ...
- egg项目eslint不识别链式操作符的解决方法
项目用到链式?.结果eslint一直提示 const permissionHandleArr = positionPermissionHandle.map(item => item.permis ...
- java开发中的链式思维 —— 设计一个链式过滤器
概述 最近在弄阿里云的sls日志服务,该服务提供了一个搜索接口,可根据各种运算.逻辑等表达式搜出想要的内容.具体语法可见https://help.aliyun.com/document_detail/ ...
随机推荐
- 【Other】推荐点好听的钢琴曲
2013-12-13 16:19 匿名 | 浏览 138977 次 音乐钢琴 推荐点好听的钢琴曲,纯音乐也可以thanks!!! 2013-12-14 19:34 网友采纳 热心网友 巴洛克:帕海贝尔 ...
- MyBatis3: Could not find SQL statement to include with refid ‘
错误: org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.builder.Incompl ...
- 六间房 去掉水印的方法 绕过游客VIP限制
firefox 40 + Adblock Plus 2.6.9.1 + Execute JS 0.2.4.1 Adblock Plus 过滤规则里添加 ------------------------ ...
- UVALive 7261 Xiongnu's Land (扫描线)
Wei Qing (died 106 BC) was a military general of the Western Han dynasty whose campaigns against the ...
- VS2010设置C++包含目录和库目录
视图-属性管理器-随便选择一个项目例如MyProject-Debug|Win32-Microsoft.Cpp.Win32.user-右键“属性”-VC++目录 Release同理
- 【Ubuntu14.04.1】设置开机可以Root用户身份登录
$ sudo gedit /usr/share/lightdm/lightdm.conf.d/50-ubuntu.conf [SeatDefaults]user-session=ubuntugreet ...
- Linux下的ip命令，除了ifconfig还有很多
linux的ip命令和ifconfig类似,但前者功能更强大,并旨在取代后者.使用ip命令,只需一个命令,你就能很轻松地执行一些网络管理任务.ifconfig是net-tools中已被废弃使用的一个命 ...
- .net学习笔记---IIS 处理模型及ASP.NET页面生命周期
本文是基于IIS6的处理模型. 当一个客户端页面访问IIS试图获取一些信息的时候,发生了什么事情?一个请求在通过了HTTP管道后又发生了什么?本文主要是描述这两个过程,即IIS处理asp.net请求和 ...
- WMI
https://wiki.jenkins-ci.org/display/JENKINS/Windows+slaves+fail+to+start+via+DCOM#Windowsslavesfailt ...
- 9.装饰者模式(Decorator Pattern)
using System; namespace ConsoleApplication7 { class Program { static void Main(string[] args) { // 我 ...