//需求,创建一个div,添加到页面上,给div添加属性
//面向对象开发,构造函数创建类
function divTag(){
this.div1=document.createElement('div');
this.appendTo=function(node){
node.appendChild(this.div1);
return this;//将构造函数的new的新对象返回,因为它里面有这两个方法,所以才能链式操作
}
this.css=function(obj){
for(var k in obj){
this.div1.style[k]=obj[k];
};
return this;//将构造函数的new的新对象返回,因为它里面有这两个方法,所以才能链式操作
};
}

//实例化
var div =new divTag();
div.css({
'border':'1px dotted red',
'width':'100px',
'height':'200px'
}).appendTo(document.body);

模拟jq的设置样式的更多相关文章

  1. jQ的隐式迭代和设置样式属性

    jQ中的隐式迭代 意义:不需要原生迭代了,在jQ内部自动帮你实现了循环 代码实现: let arr = document.querySelectorAll('li') for(let i = 0;i ...

  2. css3模拟jq点击事件

    还是这个梗,收好冷.今天是一个css3模拟jq点击事件,因为我发现,css3中没有类似于,js的点击事件,那么,可不可以仿照 jq的效果,类似的做一个呢?主要用到,input里面的radio 单选按钮 ...

  3. jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息

    jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...

  4. (20)jQuery的文档操作(创建,添加、设置样式和删除等)

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

  5. word-wrap&&word-break,奇偶行、列设置样式

    1.word-wrap和word-break区分. 来源场景:机械租赁mvc驾驶员信息查看: 当备注的文字多的时候,第一列的值成这模样: 解决方案:设置table 的td可自动换行.首先table设置 ...

  6. 注意Android里TextView控件的一个小坑,用android:theme来设置样式时动态载入的layout会丢失该样式

    注意Android里TextView控件的一个小坑,用android:theme来设置样式时动态载入的layout会丢失该样式 这个坑,必须要注意呀, 比如在用ListView的时候,如果在List_ ...

  7. Vue系列: 如何通过组件的属性props设置样式

    比如我们要在vue中显示百度地图,然后将相关的代码包装成组件,然后需要由外部来设置组件的高度,关于props的介绍,可以参考: http://cn.vuejs.org/guide/components ...

  8. 【使用 DOM】为DOM元素设置样式

    1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleS ...

  9. 【温故而知新-Javascript】为DOM元素设置样式

    1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleS ...

随机推荐

  1. MongoDB固定集合(capped collection)

    一 . 什么是固定集合 MongoDB中有一种特殊类型的集合,值得我们特别留意,那就是固定集合(capped collection). 固定集合可以声明collection的容量大小,其行为类似于循环 ...

  2. 嵌入式Linux系统移植——uboot常用命令

    flash的一般分区: 其它数据 环境变量 可执行程序.如bootloader print(可缩写为:pri):打印查看uboot这个软件中集成的环境变量setenv.saveenv:设置.保存环境变 ...

  3. 20155306 2006-2007-2 《Java程序设计》第2周学习总结

    20155306 2006-2007-2 <Java程序设计>第2周学习总结 教材学习内容总结 第三章 基础语法: java中,基本类型:布尔(boolean):boolean类型分为tr ...

  4. 20155339 2016-2017-2 《Java程序设计》第4周学习总结

    20155339 2016-2017-2 <Java程序设计>第4周学习总结 教材学习内容总结 继承.多态与is-a 继承就是避免多个类间重复定义共同行为. 可以把相同的成粗代码提升为父类 ...

  5. java 万能转换器 输入SQL 直接得到ArrayList

    //java万能List转换器 public static <T> ArrayList<T> ToList(Class<T> clazz,String sql) t ...

  6. 北京Uber优步司机奖励政策(4月12日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  7. RHCSA day5

    4.调整逻辑卷容量 请按照以下要求调整本地逻辑卷lvm1的容量: 调整后的逻辑卷及文件系统大小为770MiB 调整后确保文件系统中已存在的内容不能被破坏 调整后的容量可能出现误差,只要在730MiB ...

  8. java模拟http请求

    java模拟http发送请求,第一种是HttpURLConnection发送post请求,第二种是使用httpclient模拟post请求, 方法一: package main.utils; impo ...

  9. python装饰器简单使用

    装饰器和闭包关联很大,要先明白闭包是什么 原始代码: def foo(): print('fcc') 增加装饰器 from time import ctime,sleep def w(fcc): de ...

  10. 怎样安装Scrapy

    Windows怎样安装Scrapy? pip install scrapy会报错 访问https://www.lfd.uci.edu/~gohlke/pythonlibs/#twisted 下载并放到 ...