06 2012 档案

精确获取元素样式值 - 盒模型
摘要：两个要点：1. 盒模型的计算方式2. 默认值的处理计算方式先说前提条件，即 doctype 是<!doctype html>，也就是浏览器会按标准模式渲染网页，这样的话，所有浏览器的盒模型的计算方式都是： 可见宽度 = borderLeftWidth + paddingLeft + width + paddingRight + borderRightWidth; 可见高度 = borderTopWidth + paddingTop + height + paddingBottom + borderBottomWidth;因为IE8+ 和其他非IE浏览器都支持 box-sizing， 阅读全文
posted @ 2012-06-27 19:25 越己 阅读(436) 评论(0) 推荐(0) 编辑
精确获取元素样式值 - 位置
摘要：写这篇文章我很矛盾，因为如果非常规范的写代码，这篇文章说的问题根本就不存在。因为 top right / bottom left 一般都会手动设置，如果不小心结果是 auto，那绝对是您忘了赋值了。比如为了绝对定位到父级元素（offsetParent）的左上角，有时候我们会偷懒写成下面这样：position: absolute;我们以为浏览器默认会填上 left: 0; top: 0; 没错，大部分浏览器都会实现同样的效果，但是却不是 0px，而是 auto，这时候问题就来了，而且我曾经在Firefox x.0 中发现，这样简写居然不是定位到左上角，当然最新的版本已经解决了这个问题。首先说明一 阅读全文
posted @ 2012-06-27 19:24 越己 阅读(392) 评论(0) 推荐(0) 编辑
精确获取元素样式值
摘要：这个系列的文章会介绍如何精确取值，开篇准备了一些闲言碎语。首先介绍两个工具方法：/** * 把连字符形式转成驼峰形式，如margin-left => marginLeft * @param {String} name * @return {String} */function camelize(name) { return name.replace(/-([a-z])/g, function($0, $1) { return $1.toUpperCase(); });}/** * 把驼峰形式转成连字符形式，如marginLeft => margin-left * @p... 阅读全文
posted @ 2012-06-27 19:23 越己 阅读(376) 评论(0) 推荐(0) 编辑
【jQuery-1.7.2源码分析】extend
摘要：上一篇说的jQ对象的鸟瞰图，这还是一个非常简单的对象，jQ强大的各种方法则是通过各种扩展实现的。jQ的扩展分两种1.把相对紧凑的方法统一在一处，因此，在内部写法上看起来是一个个的模块，这样便于维护。其中分为两类：1) 基于jQuery这个对象，也就是静态属性/方法的作用，这部分的扩展更为通用，比如attr: function( elem, name, value, pass )，脱离jQ对象也可以使用2) 基于 prototype 的，内部大多只是借用了静态属性/方法2. 当作工具方法如需要给obj = {a:1, b:2}对象加几个属性，就直接obj = jQuery.extend(obj, 阅读全文
posted @ 2012-06-04 14:55 越己 阅读(601) 评论(0) 推荐(0) 编辑
【jQuery-1.7.2源码分析】jQuery对象
摘要：前言看了一些别人写的源码分析文章，大多是贴代码，写注释。个人觉得从中吸取到的知识有限，因为这样多重于技巧，而轻于设计思想，所以本系列不打算重复老路，更多的是把我看源码的心得分享出来。对于一些值得推广的技巧，会在文章结尾处专门列出，以便查找。jQuery对象是什么，举个例子，$('#id') 返回的就是jQuery对象，这个东西是整个jQuery的核心所在，所以我先来分析它。var jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 阅读全文
posted @ 2012-06-04 14:54 越己 阅读(1175) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示