
JavaScript DOM和BOM
文章平均质量分 81
Tank_in_the_street
微信公号:我就喜欢摸鱼。在那里分享更多有趣的事情
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
对拖拽的高级应用,实现自定义滚动条
下面的自定义滚动条实现了三个功能,一个是对鼠标滚动的监听,一个是对鼠标拖动的监听,最后一个是对鼠标点击的监听,基本上实现了现代浏览器的滚动条功能。 #parent{ width: 15px; height: 500px; background: #ccc; position: relative; margin: 10p原创 2017-10-15 17:06:53 · 832 阅读 · 0 评论 -
对拖拽的高级应用,实现带框拖拽
本文将对我上篇JavaScript拖拽进行添加特效,实现类似windows7系统那样带框的拖拽。如果有疑问的话先看我上一篇文章JavaScript实现拖拽。本文主要细讲如下实现这特效的细节。 在JavaScript中我们要实现一个带框的拖拽的话,其实这个框本身也是一个div元素,而这个div元素是我们动态生成的。要想让这个框会动,首先我们对它的定位动手,在css中新设一个id,让原创 2017-10-14 14:14:37 · 666 阅读 · 0 评论 -
JavaScript中,四种事件绑定方法及attachEvent与addEventListener的区别
我们在对事件进行绑定的时候,除了常用的对元素对象后面通过点加属性来事件绑定,如:a.onclick = function(){ //code} 我们还能通过attachEvent和addEventListener来进行事件绑定,这两个方法是有区别的,前者的这个方法是用在ie6到8的浏览器那里,而后者的方法是用在除了ie6到8的其他浏览器里。这两个方法对于浏览器的兼容来说原创 2017-10-14 12:15:38 · 1219 阅读 · 0 评论 -
JavaScript实现拖拽和解决部分bug
一般来说,实现拖拽的话,拖拽的基本功能是你对某个想要移动的元素进行点击,点击后按住不放进行移动,该元素就会跟着你的鼠标移动,当你把鼠标一松开,则该元素就会定格在那里。一般的实现这个功能要注意两个地方,一是该元素必须是绝对定位,因为绝对定位脱离了文档流,才能够随意的移动;二是如何能够很好的获取移动的坐标,我们获取的坐标是鼠标移动的坐标减去鼠标在该元素距离边框的坐标,比如说我们点击了该元素的中心位置,原创 2017-10-12 16:59:23 · 3149 阅读 · 0 评论 -
js的element中,属性以scroll、client和offset为前缀的属性的区别
下面提的Height和Width是基于W3C标准的。 首先提的是clientHeight和clientWidth属性,这个属性返回的值是该属性作用的元素的高度+上下内边距-滚动条宽度或者宽度+左右内边距-滚动条宽度,不包括边框、外边距和滚动条。但是在ie5却不是这个结果。ie5的clientHeight和clientWidth等于该元素的高度减上下边框减滚动条宽度或者宽度减左原创 2017-10-11 20:41:40 · 654 阅读 · 0 评论 -
浅谈js里的attributes和与之相关的一些属性
在前端里,想要对静态的HTML变得更加的动态,就必须要对HTML的dom进行操作,dom犹如一个树,树的最底层是文档节点,这个节点顺着上来就到了html节点,也就是根节点。这个根节点有两个分支,一个是body,另一个是head。head里面有很多个子节点,必须要有的是title节点,其他常见的有meta、style、link等,而body里面也有无数个节点。就拿body里面的p节点来讲,里面就有文原创 2017-10-07 12:16:29 · 8383 阅读 · 0 评论 -
innerHTML、innerText和outerHTML的区别
在JavaScript里,innerHTML和innerText的主要区别是innerHTML能够把作用元素内的所有内容包括标签都能输出来,而innerText只能输出文本内容,不能输出标签。举个例子,下面的这个例子div标签下有一个文本,这两个方法都能输出haha,但是如果div标签里多一个p标签的话,那么会体现出他们的不同: haha var a = document.getEle原创 2017-10-07 11:33:48 · 548 阅读 · 0 评论 -
JavaScript中documentElement和body的区别及jQuery中实现兼容的原理
在浏览器里documentElement是一个只读属性,返回的是document节点下的子节点,一般是html。而document.body返回的是body。这两个东西在用到获取浏览器的scrollTop等应用时会发现一些不同,下面代码放到有滚动条的页面运行,当你滚动滚动条的时候,看看火狐、谷歌和ie浏览器到底得出什么样的结果。如:console.log(document.document原创 2017-10-16 11:20:14 · 2123 阅读 · 0 评论 -
userAgent大全
一、基础知识篇:HttpHeader之User-AgentUserAgent中文名为用户代理,是Http协议中的一部分,属于头域的组成部分,UserAgent也简称UA。它是一个特殊字符串头,是一种向访问网站提供你所使用的浏览器类型及版本、操作系统及版本、浏览器内核、等信息的标识。通过这个标识,用户所访问的网站可以显示不同的排版从而为用户提供更好的体验或者进行信息统计;例如用手机访问谷歌和转载 2017-10-16 16:40:47 · 6502 阅读 · 0 评论