Web前端-JS客户端
关注
分享
扫一扫
文章平均质量分 69
zccst
这个作者很懒，什么都没留下…
展开
-
top、clientTop、scrollTop、offsetTop的区别
作者：zccst2014-9-20最近在写拖拽组件的时候用到这些知识。1，offsetoffsetWidth 元素自身宽度offsetHeight 元素自身高度offsetTop 元素相对于父元素的纵向偏离值offsetLeft 元素相对于父元素的横向偏离值offsetX 相对于父元素的横坐标offsetY 相对于父元素的纵坐...原创 2011-11-20 23:10:56 · 177 阅读 · 0 评论 -
doctype和compatModel相关
作者：zccst[size=large]一、doctype[/size][b]1，严格模式与混杂模式的区分？如何触发这两种模式？ [/b]在 HTML 4.01 和 XHTML 中分别有三种 声明。在 HTML5 中只有一种。1.过渡的(Transitional)：要求非常宽松混杂模式：浏览器对XHTML的解析较为宽松。允许使用4.01中的标签，但必须符合XH...原创 2015-01-04 19:30:04 · 148 阅读 · 0 评论 -
Document，Node，Element，HTMLDocument ，HTMLCollection，HTMLElement，NodeList
作者：zccst这个问题如果不是基于原生js写组件，可能仍然不明不白，既然遇到了，就整理一下。[size=large]一、Document，Node，Element的关系[/size]1，Document 对象Document 对象是一棵文档树的根，可为我们提供对文档数据的最初（或最顶层）的访问入口。用于元素节点、文本节点、注释、处理指令等均无法存在于 document...原创 2015-01-05 15:38:30 · 460 阅读 · 0 评论 -
document.body.scrollTop和document.documentElement.scrollTop
作者：zccst网页可见区域宽： document.body.clientWidth;网页可见区域高： document.body.clientHeight;网页可见区域宽： document.body.offsetWidth (包括边线的宽);网页可见区域高： document.body.offsetHeight (包括边线的宽);网页正文全文宽： docu...原创 2013-09-14 14:44:44 · 157 阅读 · 0 评论 -
document.body、document.documentElement和window获取视窗大小的区别
作者：zccst参考网址：[url]http://www.ido321.com/906.html[/url]2015-3-27$(window).height(); 才是窗口的宽高，而且一直不变document.body.clientHeight，在文档内容有滚动条的时候远大于$(window).height();实际例子，向下滑动判断$(document).h...原创 2015-03-04 15:12:17 · 327 阅读 · 0 评论 -
[html5]navigator.online属性检测用户是否在线
作者：zccstnavigator.online属性检测用户是否在线以前我写webapp时都是通过ajax的超市时间来测试用户是否在线的。[code="js"]if (navigator.onLine) { //在线} else { //离线状态}[/code]这个html5的 navigator的新特性可以搞定.navigato...原创 2015-03-20 14:11:23 · 788 阅读 · 0 评论 -
[BOM]navigator知识点
作者：zccst[b]历史[/b] 最早的时候有一个浏览器叫NCSA Mosaic，把自己标称为NCSA_Mosaic/2.0 (Windows 3.1)，它支持文字显示的同时还支持图片，于是Web开始好玩起来。 然后出现了一个新的网页浏览器，“Mozilla”，其实就是“Mosaic终结者”的意思，这搞的Mosaic很不爽，（毕竟Mosaic出道早，江湖老），新浏览器最后正...原创 2015-03-20 14:42:37 · 198 阅读 · 0 评论 -
scroll时判断向下滚动还是向上滚动
作者：zccst有时候需要用到，判断页面是向上还是向下滚动了，兼容比较低版本的浏览器如IE6、7等。原理：拿当前的scrollTop和之前的scrollTop对比如果变大了，表示向下滚动（scrollTop值变大）；如果变小了，表示向上滚动（scrollTop值变小）。难点是理解setTimeout=0时的运行机制。[code="js"]$(docume...原创 2015-03-30 16:53:35 · 2759 阅读 · 0 评论 -
js浏览器端判断当期是否在线
作者：zccst纯浏览器端解决办法就是轮询，img轮询和ajax批注：img轮询要加时间戳，ajax轮询要避免跨域。[code="js"] var img = new Image(); img.id = "test_is_online"; img.onload = function(){ document.body.removeChil...原创 2015-04-17 20:50:22 · 276 阅读 · 0 评论 -
js跨域的多种解决办法
作者：zccst2015-3-11JavaScript跨域总结与解决办法 [url]http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html[/url]1，window.domain2，XMLHTTPREQUEST3，script标签：jsonp4，window.name ...原创 2014-09-20 09:41:25 · 102 阅读 · 0 评论 -
DOM元素在浏览器中的位置参数，如offset,ownerDocument
作者：zccst2014-10-21区分clientX和screenX的简单办法是？client指浏览器左上角；screen指显示器左上角。所以正常情况下screen>=client。2014-10-08学习一下，好像有很多相关的参数[b]1，documentElement 和 body[/b]（1）documentElement 属性 ...原创 2014-10-08 17:07:11 · 606 阅读 · 0 评论 -
又一次掉进encodeURIComponent的坑里了
作者：zccst原坑：get请求ajax.get ( url+'?k1'=v1+'&k2'=v2+'&k3'=v3, ... );由于URL只进行了encodeURI编码，所以想提交的参数有searchWord = a+b时，变成了a b。解决办法：ajax.post( url, params,....)其中params是对象。...原创 2014-11-05 18:21:24 · 3416 阅读 · 0 评论 -
window.history
作者：zccst[img]http://dl2.iteye.com/upload/attachment/0104/5817/adf7c90a-8ba5-3005-940a-fe47923447e5.png[/img][img]http://dl2.iteye.com/upload/attachment/0104/5756/b1700c97-bb95-3edb-ac7d-b36238...原创 2014-12-23 10:37:10 · 253 阅读 · 0 评论 -
[Event]事件（高程版）（二）事件处理程序
作者：zccst[code="html"][/code]1，DOM0级 优点是兼容所以浏览器[code="js"] /* 1， DOM0级 优点是兼容所以浏览器*/ var btn1 = document.getElementById("btn1"); btn1.onclick=function(e){ alert("Button Clicked");...原创 2014-06-17 18:00:20 · 115 阅读 · 0 评论 -
JavaScript课程大纲（珠峰版）
[size=large]基础部分[/size]第一周：1、javascript脚本在网页里的几种写法，语法，变量类型。2、JS控制HTML属性（HTML DOM）和JS控制CSS属性（CSS DOM）及类样式。3、条件判断语句（if else,三元运算符，if else if和switch的区别），break和return的应用和区别；4、循环的几样写法（for,while...原创 2012-02-11 11:37:32 · 979 阅读 · 0 评论 -
js 事件基础
作者：zccst[b][size=large]3，stopPropagation, preventDefault 和 return false 的区别[/size][/b]stopPropagation ：停止事件传播preventDefault：阻止默认动作return false：阻止动作（包括默认的和不默认的）比如，a有跳转功能，通过preventDefault可...原创 2012-03-04 00:04:22 · 85 阅读 · 0 评论 -
javascript知识体系（自己总结版）
一、类似C/C++/Java/PHP等语言的部分第一阶段：面向过程编程。优点：简单，缺点：复用性差几乎不使用什么特别的知识点，入门门槛几乎为0第二阶段：面向对象编程。优点：灵活，缺点：门槛较高用到的重要知识点：1，类的继承和prototype2，匿名函数和闭包3，argument（包括caller，callee）4，call和apply（体会this的含义）...原创 2012-03-05 01:17:24 · 255 阅读 · 0 评论 -
js-location对象
zccst总结2015-04-14获取location的URL中的key的值获取/设置hash指定key的值[code="js"]getQueryString: function (name) { var reg = new RegExp("(\\?|^|&|\#)" + name + "=([^&|^#]*)(&|$|#)", "i"); var r = wind...原创 2013-12-11 17:05:48 · 119 阅读 · 0 评论 -
document操作iframe
作者：zccst//在iframe内获取父页面节点window.parent.document.getElementById("page_header");原创 2013-12-13 16:26:17 · 196 阅读 · 0 评论 -
js-event（事件对象及其属性、方法）
zccst整理2014-10-21Event 对象Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用，函数不会在事件发生前被执行！其中：event.target不支持IE浏览器。1，事件句柄（事件函数）：以on开头的若干2，鼠标/键盘属性：[img]http://dl2...原创 2013-02-17 11:43:06 · 1591 阅读 · 0 评论 -
DOM0-节点关系，节点操作API
作者：zccst2014-09-20 补充一、节点类型nodeType1 表示元素Element二、节点操作基础，如果document获取节点：document.getElementById(elementId);document.getElementsByClassName(tagName);document.getElements...原创 2014-06-09 15:29:25 · 134 阅读 · 0 评论 -
事件基础（高程版）
作者：zccst2014-5-4一、事件流标准：DOM事件流中，实际的目标在捕获阶段不会接收到事件。即捕获从document到body就停止了。在处于目标阶段，事件在div上发生，并在事件处理中被看成冒泡阶段的一部分。实际：在捕获阶段会涉及，结果有两个机会在目标对象上操作事件。 二、事件处理程序（事件监听器）事件处理程序：HTML，DOM0级，DOM2级...原创 2014-06-09 16:37:39 · 125 阅读 · 0 评论 -
JSONP原理及实现
作者：zccst2015-04-30 更新[b]跨域实现的两种方式[/b]一、通过src="http://romateServer.com/api?callback=callbackHandler"回调成功后，在浏览器端实现callbackHandler方法，返回值在callbackHandler参数中批注：既然如此，所有src都可以实现跨域。比如图片src等。具体...原创 2014-06-09 16:47:31 · 267 阅读 · 0 评论 -
target与currentTarget的区别(jqueryui方式获取z-Index)
作者：zccst2014-6-25今天看了jQuery手册，发现jQuery的事件对象模块也有一个currentTarget，始终指向this。所以结论是：原生的currentTarget与jQuery的currentTarget完全不是一回事。要重点区别对待。2014-6-17target与currentTarget的区别？通俗易懂的说法：比如...原创 2014-06-17 12:00:25 · 304 阅读 · 0 评论 -
[Event]事件（高程版）（一）事件类型
作者：zccst[b]一、UI事件[/b]1，load两种添加方式：js方式添加，img也可以触发load事件，无论在DOM中，还是HTML中，例如，当然也可以用js方式实现但一定要先添加事件，再指定src属性。[img]http://dl2.iteye.com/upload/attachment/0104/4495/b507febe-b76e-3da8-a58...原创 2014-06-17 17:59:14 · 219 阅读 · 0 评论 -
js 页面刷新location.reload和location.replace的区别小结
作者：zccstreload 方法，该方法强迫浏览器刷新当前页面。 语法： location.reload([bForceGet]) 参数： bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5("刷新") replace 方法，该方法通过指定URL替换当前缓存在历史里（...原创 2014-12-02 20:57:59 · 1314 阅读 · 0 评论