123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> body { height: 3000px; } #box { width: 100px; he ...
什么是CSS清除浮动? 在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象。这个现象叫浮动溢出,为了防止这个现象的出现而进行的CSS处理,就叫CSS清除浮动。 方法一:使用带clear属性的空元素 在浮动元素后使用一个空元素如``,并在CSS中赋予.clear{clear:both;}属性即可清理浮动。亦可使用 或来进行清理。 优点:简单,代码少,浏览器兼容性好。缺点:需要添加大量无语义的html元素,代码不够优雅,后期不容易维护。 方法二:使用CSS的overflow属性 给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动,另外在 IE6 中还需要触发 hasLayout ,例如为父元素设置容器宽高或设置 zoom:1。在添加overflow属性后,浮动元素又回到了容器层,把容器高度撑起,达到了清理浮动的效果。 方法三:给浮动的元 ...
disabled 属性可设置或返回是否禁用 checkbox。语法:Object.disabled=true|falsetrue表示禁用 false表示可用 clientWidth clientHeight这两个属性都可以获取元素的可见高度和宽度会获取元素的宽度和高度,包括内容区和内边距 offsetWidth offsetHeight获取元素的整个宽度和高度,包括内容区和内边距,边框 scrollLeft 可以获取水平滚动条的距离scrollTop 可以获取垂直滚动条的距离 scrollWidth scrollHeight可以获取元素整个滚动区域的宽度和高度 等式成立时表示垂直滚动条到达最底部Object.scrollHeight-Object.scrollTop==Object.clientHeight 等式成立时表示水平滚动条到达最右端当满足Object.scrollWidth-Object.scrollLeft==Object.clientWidth 1234567891011121314151617181920212223242526272829303132333435 ...
有两种方法:第一种:currentStyle  语法:元素.currentStyle.样式名  他可以用来读取当前元素正在显示的样式  如果当前元素没有设置该样式,则获取它的默认值  currentStyle只有在IE浏览器中支持,其他浏览器都不支持。 第二种:getComputedStyle()方法  getComputedStyle()这个方法来获取元素当前的样式    这个方法是window的方法,可以直接使用  需要两个参数    第一个:要获取样式的元素    第二个:可以传递一个伪元素,一般都传null  该方法会返回一个对象,对象中封装了当前元素对应的样式    可以通过 对象.样式名 来读取样式  如果没有设置样式则会获取到真实的值,而不是默认值 ...
正则表达式的思维导图: 正则的捕获exec()  exec() 方法用于检索字符串中的正则表达式的匹配。 1RegExpObject.exec(string) 参数 描述 string 必需。要检索的字符串。 返回值:返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。 (1)懒惰性  我们先看一个例子: 123456let reg = /\d+/let str = '112hello456world789' console.log(reg.exec(str));console.log(reg.exec(str));console.log(reg.exec(str));   上述三个打印输出的都是一样的:   我们可以发现,每次匹配到的结果都是相同的,而且索引index的值一直没变,始终指向第一次匹配到的字符串的起始位置,这就是正则的懒惰性,只匹配第一次匹配到的结果,不再向后匹配。  怎么解决懒惰性问题呢?很容易,加个 ...
两者使用的目的:改变调用的函数体内部的this的指向。  相同点:均是调用某对象的方法,格式:obj.函数名.call()  call(obj,参数1,参数2):两个参数,前者将代替Function类里this对象,后者(多个元素)作为参数传递给被调用的函数。 12345678910var foo = { name:"name1", logName:function(){ console.log(this.name); }}var bar={ name:"name2"};foo.logName.call(bar);//name2   apply(obj,[参数1,参数2]),同上,不同点是第二个参数是数组。(将数组的每个元素作为一个个参数传递给被调用的函数,性质与call()方法一样)   利用apply()这一特性的一些小场景: 12345678910//求数组的最大值var arr = ...
对象原型 每一个对象都有一个内置的 proto 属性指向构造它的函数prototype属性. 而构造函数的prototype.constructor 则指向构造函数本生。一个对象的属性的寻找过程由以下几个部分组成: 寻找对象属性的数据描述符(writable, value)或存取描述符(getter, setter),如果查询到了,则返回 对应的值。如果查询不到,则进入第2步骤。 寻找对象属性的值是否有被显示定义 (可以通过 Object.getOwnPropertyNames)检测,如果对象属性定义了,则返回定义的值。 如果没有,则进入第3步骤。 寻找对象的隐藏原型__proto__对象的属性,规则同1,2步骤。如果还未找到,则重复第3步骤, 直到__proto__ 为null 为止。   我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype。 12345678910function Person() { //创建构造函数 } function MyClass() { //创建构造函 ...
  首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然网上大部分的文章都是这样说的,虽然在很多情况下那样去理解不会出什么问题,但是实际上那样理解是不准确的,所以在你理解this的时候会有种琢磨不透的感觉),那么接下来我会深入的探讨这个问题。  为什么要学习this?如果你学过面向对象编程,那你肯定知道干什么用的,如果你没有学过,那么暂时可以不用看这篇文章,当然如果你有兴趣也可以看看,毕竟这是js中必须要掌握的东西。 例子1: 123456function a(){ var user = "阿清"; console.log(this.user); //undefined console.log(this); //Window}a();   按照我们上面说的this最终指向的是调用它的对象,这里的函数a实际是被 ...
    基本类型:String、Number、Boolean、Null、Undefined    应用数据类型:Object他们有什么区别呢?  我们先看一个例子: 12345var a = 10;var b = a;a++; 修改a的值console.log("a=" + a); //a=11console.log("b=" + b); //b=10   我们发现a的值发生了改变,但是b的值并没有发生改变。这是就说明a和b是完全独立的,一个值的改变不会影响其他值。  我们再看一个例子: 12345678910 var obj1 = new Object(); obj1.name = "阿清"; var obj2 = obj1; console.log(obj1.name); // 阿 ...
    Hexo搭建博客的时候,已经使用命令在cmd中下载了依赖包,但是执行 hexo d 和hexo g 报错,报错如下:    导致这个原因为在自己的博客文件夹中,.gitignore文件中添加了node_modules/,导致更新的时候,这个文件夹被忽略,没有被更新上去。解决方案: 进入博客根目录 执行 cnpm install 执行 hexo s 执行成功后,再到博客下的git中执行 hexo d /hexo g 发现可以执行成功了。     愿你的坚持终有收获。
公告
博客微信小程序版已上线,同步更新,请扫码浏览。🎉