阿乐のBlog - aqingya.cn

I 封装成方法如下： 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051/* 定义一个函数 addClass() 用来向元素中添加指定的class属性值参数： obj ：要添加class属性值的元素 cn ：套添加的class属性为字符串 */ function addClass(obj, cn) { if (!hasClass(obj, cn)) { obj.className += " " + cn; } }; /* * 判断一个class中是否含有指定的class属性值 * 参数： obj ：要 ...

JavaScript元素类的操作总结。

发表于2020-04-27|JavaScript|JavaScript| 条评论

大致分为三个步骤：鼠标摁下 onmousedown 鼠标移动 onmousemove 鼠标抬起 onmouseup 注意的一点是 onmousemove事件和onmouseup事件是在onmousedown事件里面的代码如下（不支持IE8及以下浏览器）：代码一123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...

JavaScript ---鼠标拖拽元素问题总结

发表于2020-04-25|JavaScript|JavaScript| 条评论

指将事件统一绑定给元素的共同的祖先元素，这样当后代元素上的时间触发时，会一直冒泡到祖先元素。从而通过祖先元素的响应事件来处理事件。事件委派是利用了冒泡，通过委派可以减少事件的绑定次数，提高程序的性能。 target：target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</t ...

JavaScript ---事件的委派

发表于2020-04-24|JavaScript|JavaScript| 条评论

为一个元素绑定多事件有两种方法：addEventListener（）和 attachEvent() addEventListener（） —IE8及以下不支持通过这个方法也可以为元素绑定响应函数参数： 1.事件的字符串，不要on 2.回调函数，当事件触发时该函数会被调用 3.是否在捕获阶段触发事件，需要一个布尔值，一般都传false 使用addEventListener () 可以同时为一个元素的相同事件同时绑定多个响应函数，这样当事件被触发时，响应函数将会按照函数的绑定顺序执行。 attachEvent() 在IE8中可以使用attachEvent()来绑定事件参数： 1.事件的字符串，要on。 2.回调函数。这个方法也可以同时为一个事件绑定多个处理函数。不同的是它是后绑定的先执行，执行顺序和addEventListener()相反。br 但是这样就出现了浏览器不兼容的问题，我们可以自己定义 ...

JavaScript中 --- 绑定多事件问题浏览器兼容性解决方法。

发表于2020-04-24|JavaScript|JavaScript| 条评论

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 ...

JavaScript ---div跟随鼠标移动

发表于2020-04-23|庖丁解牛|JavaScript| 条评论

什么是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属性后，浮动元素又回到了容器层，把容器高度撑起，达到了清理浮动的效果。方法三：给浮动的元 ...

用CSS来解决“高度塌陷”问题（清除浮动）

发表于2020-04-23|CSS|CSS| 条评论

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 ...

JavaScript---检测滚动条是否到底

发表于2020-04-23|庖丁解牛|JavaScript| 条评论

有两种方法：第一种：currentStyle 语法：元素.currentStyle.样式名他可以用来读取当前元素正在显示的样式如果当前元素没有设置该样式，则获取它的默认值 currentStyle只有在IE浏览器中支持，其他浏览器都不支持。第二种：getComputedStyle()方法 getComputedStyle()这个方法来获取元素当前的样式这个方法是window的方法，可以直接使用需要两个参数第一个：要获取样式的元素第二个：可以传递一个伪元素，一般都传null 该方法会返回一个对象，对象中封装了当前元素对应的样式可以通过对象.样式名来读取样式如果没有设置样式则会获取到真实的值，而不是默认值 ...

js中如何获取元素的当前显示样式----简单总结。

发表于2020-04-23|庖丁解牛|JavaScript| 条评论

正则表达式的思维导图：正则的捕获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的值一直没变，始终指向第一次匹配到的字符串的起始位置，这就是正则的懒惰性，只匹配第一次匹配到的结果，不再向后匹配。怎么解决懒惰性问题呢？很容易，加个 ...

JavaScript中正则表达式的常用总结

发表于2020-04-20|正则表达式|正则表达式| 条评论

两者使用的目的：改变调用的函数体内部的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 = ...

细谈apply()与call()

发表于2020-04-17|JavaScript|JavaScript| 条评论

数据库加载中