//需求,创建一个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. docker入门——安装(CentOS)、镜像、容器

    Docker简介 什么是docker 官方解释: Docker is the company driving the container movement and the only container ...

  2. nexus3使用docker运行/创建docker私有仓库/maven私有仓库

    version: '3.2' services: nexus3: container_name: nexus3 hostname: nexus3 image: sonatype/nexus3:3.14 ...

  3. 旭日图(sunburst chart)绘制:R语言 & excel

    旭日图(sunburst chart)也叫太阳图,一种圆环镶接图,每一个圆环就代表了同一级别的比例数据,离原点越近的圆环级别越高,最内层的圆表示层次结构的顶级.除了圆环外,旭日图还有若干从原点放射出去 ...

  4. Oracle入门第六天(中)——SET运算符(交并差集)

    一.概述 1.SET运算符是什么 将多个查询用 SET 操作符连接组成一个新的查询 UNION/UNION ALL——并集 INTERSECT——交集 MINUS——差集(A\B=A中去掉B中也有的元 ...

  5. 微信小程序点击事件

    <---------------------------------------------------index文件夹:------------------------------------ ...

  6. [BZOJ2738]矩阵乘法-[整体二分+树状数组]

    Description 给你一个N*N的矩阵,不用算矩阵乘法,但是每次询问一个子矩形的第K小数. (N<=500,Q<=60000) Solution 考虑二分答案,问题转化为求矩阵内为1 ...

  7. HBase核心功能模块--读书笔记

    客户端Client 客户端 Client 是整个 HBase 系统的入口.使用者直接通过客户端操作 HBase.客户端 使用 HBase 的 RPC 机制与 HMaster 和 RegionServe ...

  8. CF 1083 A. The Fair Nut and the Best Path

    A. The Fair Nut and the Best Path https://codeforces.com/contest/1083/problem/A 题意: 在一棵树内找一条路径,使得从起点 ...

  9. 基于Spring的最简单的定时任务实现与配置(三)--番外篇 cron表达式的相关内容

    本来这篇文章是会跟本系列的前两篇文章一起发布的.但是,昨天在找资料总结的时候遇到了一点意外,就延后了一些. 本篇的内容主要参考了 这篇博文:http://www.cnblogs.com/junrong ...

  10. 集群服务器、负载均衡和session共享,C#的static变量

    集群服务器:是指由两台以上服务器共同组成的服务器,目的是为了提高性能. 负载均衡:是基于集群服务器实现的,作用是当A服务器访问数达到一定上限时,接下来客户端的请求会自动分配给B服务器,目的是减少服务器 ...