前言 z-index是一个用于控制文档中图层顺序的属性。具有较高z-index值的元素将会出现在具有较低值的元素之上。...到目前为止,最常见的创建和使用层叠上下文的方式是上述列表中的第一种,所以让我们多花点时间来关注它。 回到先前的示例,我们有三个元素彼此重叠,但目前为止它们并没有z-index值。...因为父容器.site-content相比footer而言,有一个更高的z-index值,因此.site-content中的任何定位元素都将在该上下文中计算。...在层叠上下文中思考层叠顺序的一个好方法是,把它看作是嵌套有序列表中的一个子项目。...与其使用像9999、53或12这样的任意数字,不如使我们的z-index比例系统化,为程序带来更多秩序。这里我将使用以100为基础进行递增的z-index值。
css中z-index属性 1、z-index属性值:当默认值为0时,z-index属性可以设置各元素之间的重叠关系。 2、z-index值大的层位于其值小的层之上。... width: 100px; height: 100px; } .a { background-color: pink; z-index...: 1; } .c { background-color: green; z-index: 2; top: ...20px; left: 20px; } .b { background-color: red; z-index: 3;
重点:z-index要配合position一起用,否则无效; 效果图: 源代码: <div class="background-icon...position: absolute; top: 0; left: 0; width: 72px; height: 72px; <em>z-index</em>
2017-08-09 02:46:18 在JavaScript中,arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。...Javascrip中每个函数都会有一个Arguments对象实例arguments,它引用着函数的实参,可以用数组下标的方式"[]"引用arguments的元素。...可以通过下面的例子来看一下arguments的具体使用方法 function test(){ if(arguments.length>0){ for(p of arguments){ console.log...function test(){ if(arguments.length>0){ console.log(arguments.callee); } } */ 通过上面的例子可以看到callee的作用,当需要使用递归来处理问题时...function count(a){ if(a==1){ return 1; } return a + arguments.callee(--a);//此处的调用亦可使用
创建Set实例 使用 new 关键字和 Set 构造函数可以创建一个空集合: const s = new Set(); 如果想在创建的同时初始化实例,则可以给 Set 构造函数传入一个可迭代对象,其中需要包含插入到新集合实例中的元素...返回布尔值): const s = new Set(); s.add(1).add(2).add(3); s.has(1); // true 6. delete() delete(): 删除Set实例中某个元素
因此,cookie可以跨越一个域名下的多个网页,但不能跨越多个域名使用。 ③、不同浏览器对 cookie 的实现也不一样。即保存在一个浏览器中的 cookie 到另外一个浏览器是 不能获取的。...,我们可以通过读取 cookie 中的信息,恢复购物车中的物品。...但是在浏览器端,我们可以将数据保存在 cookie 中,然后在另外页面再去获取 cookie 中的数据。 PS:这里要注意 cookie 的时效性,不然会造成获取 cookie 中数据的混乱。...3、怎么使用 cookie? ...比如: document.cookie="name=中文"; //为了防止中文乱码,我们可以使用encodeURIComponent()编码;decodeURIComponent()解码 document.cookie
想要实现 Map 转为 Bean 的功能,使用了org.apache.commons.beanutils.BeanUtils.populate(object, map); 期间遇到了一些问题,遂整理了一下...org.apache.commons.beanutils.BeanUtils.populate(bean, map); System.out.println(bean.getId()); } 测试结果发现,bean的id为null,没有实现预想中的...明明我们使用了 lombok 自动给 JavaBean 生成了 getter/setter,难道 lombok 还有猫腻?...解决办法: 1、去掉 Accessors 注解 2、摸索中… 发现了这个 Introspector.findMethod(Class cls, String methodName, int argCount, Class args[]); 能按方法名获取Method对象,那么要自己实现转换逻辑,可以尝试,摸索中… ---- end
js自带函数和jquery中的append方法相似 insertAdjacentHTML是一个非常酷的DOM方法,我们可以调用任何DOM元素来向页面添加新内容。...这代表我们将HTML添加到容器中的位置。...我们有四种选项可以设置它的位置: beforebegin 在元素之前 afterbegin 在元素的第一个子元素之后 beforeend 在元素的最后一个子元素之后 afterend 在元素之后 下面的示例代码展示了,向列表中添加了一项
浅谈与使用js中的原型# 1 什么是原型# “ 每个函数都会创建一个 prototype 属性,这个属性是一个对象,包含应该由特定引用类型的实例 共享的属性和方法。...2 原型的使用# 首先我们使用设计模式中的工厂模式来实现一个Person类,可以通过new这个Person的函数来创建一个与之具有相同属性的实例,也就省的我们再次创建Person函数了。...person2 = new Person('Greg', 27, 'Doctor') person1.sayName() // Nicholas person2.sayName() // Greg 从上面代码中可以看到...有,那就是用原型,请看下面这份代码: // 工厂模式实现 方法2 使用原型属性 function Person(name, age, job) { this.name = name this.age...3 小结# 本文仅是对于原型有个简单的认识也使用,原型在js中是一个比较重要的模块,还有__proto__ 、 原型链 这些概念没有讲到,如果感兴趣,可以再通过书籍及视频来交叉理解。
背景 在JS中并没有原生枚举的实现,可以通过下面几种方法来模拟类似的操作。...直接使用字符串 上代码: function isWeekend(day) { return day === 'Sat' || day === 'Sun' } console.log(isWeekend...使用变量储存枚举值 这次进阶了一下,虽然代码啰嗦了,但是犯错概率会大大降低: const Days = Object.freeze({ Mon: 'Mon', Tue: 'Tue',...Symbol类型 虽然说用变量把枚举值储存起来了,不过只要别人愿意,他完全可以这样做: // 使用字符串时 isWeekend('Sun') // 使用数字时 isWeekend(0) 那我们属于是白封装了...JS定义枚举集合时的优化 可以尝试下列几种方法,只需要写出来枚举的名字,通过几个数组的API进行赋值操作。 但是由于是动态执行的,效率相对来说会降低,不过这通常是不足一提的。
js中if语句的使用 if 语句是使用最频繁的语句之一,语法如下: if (condition) { statement1 } else { statement2 } 1、条件(condition...这里的语句可能是一行代码,也可能是一个代码块(即包含在一对花括号中的多行代码)如下列代码: if (xhs > 1) { console.log('xhs满足大于1!')...可以像这样连续使用多个 if 语句: if (condition1) { statement1 } else if (condition2) { statement2 } else { statement3...满足大于25') } else if (xhs < 0) { console.log('xhs满足小于0') } else { console.log('xhs在0到25之间') } 以上就是js...中if语句的使用,希望对大家有所帮助。
js中repeat()的使用 1、返回一个新字符串,表示将原字符串重复n次。如果参数为小数,则会被取整。...以上就是js中repeat()的使用,希望对大家有所帮助。更多js学习指路:js教程 推荐操作环境:windows7系统、jquery3.2.1版本,DELL G3电脑。 收藏 | 0点赞 | 0打赏
js中arguments的使用 说明 1、当不确定传递了多少参数时,可以使用arguments来获取。在JavaScript中,arguments实际上是当前函数的内置对象。...所有函数都内置了一个arguments对象,所有实参都存储在arguments对象中。 2、arguments的显示形式是一个伪数组,所以可以遍历。...实例 // arguments 的使用 function fn() { console.log(arguments);// 里面存储了所有传递过来的实参 console.log(arguments.length...); console.log(arguments[0]); } fn(1,2,3); 以上就是js中arguments的使用,希望对大家有所帮助。
this) } function test3(){ console.log(this) } test3.call(this) //改变了test2的this指针 test2.call(this) } 2.使用
一、概念 1、js中可以通过setTimeout函数设置定时器,让指定的代码在指定的时间运动. 如果我们希望在setTimeout之行前终止其运行就可以使用clearTimeout()。...2、clearTimeout()用于重置js定时器,如果你希望阻止setTimeout的运行,就可以使用clearTimeout方法。...二、使用场景 1、写计时器 2、需要让程序隔一段时间处理什么事情,如3秒后自动关闭弹出框等 3、事件延迟,满足业务需求,如鼠标从主菜单moveout的时候,判断鼠标是否moveover副菜单,再隐藏副菜单...三、使用方法 [html] view plain copy var c=0 var
js中this的使用场景 使用场景 1、在构造函数中使用(构造函数本身) 2、作为对象属性时使用(调用属性的对象) 3、作为普通函数时使用(window) 4、call、apply、bind(执行的第一个参数...a.fun.call({ name: 'B' }); //this === { name: 'B' } var fun1 = a.fun; fun1(); //this === window 以上就是js...中this的使用场景,希望对大家有所帮助。...更多js学习指路:js教程 推荐操作环境:windows7系统、jquery3.2.1版本,DELL G3电脑。
js中matchAll()方法的使用 说明 1、matchAll()方法返回一个包含所有匹配正则表达式和分组捕获结果的遍历器。 2、因为返回的是遍历器,所以通常使用for...of循环取出。...index: 0, input: "abcabc", groups: undefined] //["a", index: 3, input: "abcabc", groups: undefined] 以上就是js...中matchAll()方法的使用,希望对大家有所帮助。...更多js学习指路:js教程 推荐操作环境:windows7系统、jquery3.2.1版本,DELL G3电脑。 收藏 | 0点赞 | 0打赏
---- 二、基本用法 (1)async async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。...await Promise.reject('出错了'); } f() .then(v => console.log(v)) .catch(e => console.log(e)) // 出错了 上面代码中,...function f() { await Promise.reject('出错了'); await Promise.resolve('hello world'); // 不会执行 } (3)使用注意事项...await 命令后面的 Promise对象,运行结果可能是 rejected ,所以最好把 await 命令放在 try...catch 代码块中。...hello') },1000) }) // await 后应该是一个 Promise 对象,如果不是,会被转成一个 Promise 对象 // await必须配合 async 来使用
js中join()方法的使用 说明 1、join方法能把数组序列转换为字符串, join方法后面可以跟match方法进行模式匹配。 2、返回值为一个字符串。元素是通过指定的分隔符进行分隔的。...arr[0]=“hello”; arr[1]=“xiao”; arr[2]= “bai”; arr.join("&");//“hello&xiao&bai” join();//默认分割符为逗号; 以上就是js...中join()方法的使用,希望对大家有所帮助。...更多js学习指路:js教程 推荐操作环境:windows7系统、jquery3.2.1版本,DELL G3电脑。
js函数中参数的使用 说明 1、函数内的某些值不能固定,我们可以通过参数在调用函数时传递不同的值。 2、多个参数之间用逗号分隔,形式参数可以看作是无声明的变量。...在JavaScript中,形式参数的默认值是undefined。...undefined,最终的结果:1 + undefined = NaN // 形参可以看做是不用声明的变量, num2 是一个变量但是没有接受值,结果就是undefined getsum(1); 以上就是js...函数中参数的使用,希望对大家有所帮助。
领取专属 10元无门槛券
手把手带您无忧上云