//需求,创建一个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. Delphi Android下包含第三方DEX

    1.将jar转换为dex call dx --dex -verbose --output=.\output\dex\test_classes.dex --positions=lines .\outpu ...

  2. 报错: WARN hdfs.DFSClient: Caught exception java.lang.InterruptedException

    WARN hdfs.DFSClient: Caught exception java.lang.InterruptedException 而且日志中没有错误. 官网语句:$ bin/hdfs dfs ...

  3. www.pantom.top

    新建小站 https://www.pantom.top

  4. pow函数(数学次方)在c语言的用法,两种编写方法实例( 计算1/1-1/2+1/3-1/4+1/5 …… + 1/99 - 1/100 的值)

    关于c语言里面pow函数,下面借鉴了某位博主的一篇文章: 头文件:#include <math.h> pow() 函数用来求 x 的 y 次幂(次方),x.y及函数值都是double型 , ...

  5. Go语言反射之反射调用

    ## 1 概述利用反射,不仅可以获取信息,还可以创建实例,执行函数和方法.就是反射代理执行. <!-- more -->## 2 创建实例创建实例的前提是具有 `reflect.Type` ...

  6. R语言学习笔记(二十一五):如何如何提升R语言运算的性能以及速度

    在R中获得快速运行代码的方法 使用向量化运算 R语言的并行计算可以用parallel和foreach包 加快R运行速度还可以使用cmpfun()函数即字节码编译器 再者就是在R中调用C或C++ 同时还 ...

  7. j使用数组实现约瑟夫环 java

    我们首先来看一下约瑟夫环问题: 给定m个人,m个人围成一圈,在给定一个数n,从m个人中的第一个人每第n个人便将其除去,求被最后一个出去的人的编号. 思路: 建立一个长度为m+1的数组,将其的内容初始化 ...

  8. 2016-2017-2 20155227实验三《敏捷开发与XP实践》实验报告

    2016-2017-2 20155227实验三<敏捷开发与XP实践>实验报告 实验内容 一.实验内容 XP基础 XP核心实践 相关工具 二.实验过程 (一)敏捷开发与XP 1.XP是以开发 ...

  9. 2017-2018-1 20155320《信息安全技术》实验二——Windows口令破解

    2017-2018-1 20155320<信息安全技术>实验二--Windows口令破解 实验目的 了解Windows口令破解原理 对信息安全有直观感性认识 能够运用工具实现口令破解 实验 ...

  10. hdu1042 N!(大数求阶乘)

    N! Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others)Total Submi ...