02 2014 档案
摘要：this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。但是总有一个原则，那就是this指的是调用函数的那个对象。1、纯粹函数调用。function test() { this.x = 1; alert(x);}test();其实这里的this就是全局变量。看下面的例子就能很好的理解其实this就是全局对象Global。var x = 1;function test() { alert(this.x);}test();//1var x = 1;function test() { this.x = 0;}test();alert(x);//02、作为方法...
阅读全文
摘要：each()方法能使DOM循环结构简洁，不容易出错。each()函数封装了十分强大的遍历功能，使用也很方便，它可以遍历一维数组、多维数组、DOM, JSON 等等在javaScript开发过程中使用$each可以大大的减轻我们的工作量。下面提一下each的几种常用的用法each处理一维数组vararr1=["aaa","bbb","ccc"]; $.each(arr1,function(i,val){alert(i);alert(val);});alert(i)将输出0，1，2alert(val)将输出aaa，bbb，ccceach处
阅读全文
摘要：在jQuery里有一个each方法，用起来非常的爽，不用再像原来那样写for循环，jQuery源码里自己也有很多用到each方法。其实jQuery里的each方法是通过js里的call方法来实现的。下面简单介绍一下call方法。call这个方法很奇妙，其实官方的说明是：“调用一个对象的一个方法，以另一个对象替换当前对象。”网上更多的解释是变换上下文环境，也有说是改变上下文this指针。call([thisObj[,arg1[, arg2[,[,.argN]]]]])参数thisObj可选项。将被用作当前对象的对象。arg1, arg2,, argN可选项。将被传递方法参数序列。说明call 方
阅读全文
摘要：.与除 \n 以外的任何字符匹配。如果通过 Singleline 选项（请参阅正则表达式选项）进行了修改，则句点字符与任何字符匹配。[aeiou]与指定字符集中包含的任何单个字符匹配。[^aeiou]与不在指定字符集中的任何单个字符匹配。[0-9a-fA-F]使用连字号 (–) 允许指定连续字符范围。\p{name}与 name 指定的命名字符类中的任何字符匹配。支持的名称为 Unicode 组和块范围。例如 Ll￡?Nd￡?Z￡?IsGreek￡?IsBoxDrawing。\P{name}与在 {name} 中指定的组和块范围中未包含的文本匹配。\w与任何单词字符匹配。等效于 Unicode
阅读全文
摘要：position的两个参数：水平方向的位置，垂直方向的位置----------该位置是指背景图片相对于前景对象的1.background:url(../image/header.jpg) no-repeat left top; /*相当于0% 0%*/表示背景图片在指定div的位置，从左上角开始2.background:url(../image/header.jpg) no-repeatright bottom; /*相当于100% 100%*/表示背景图片从指定div的右下角开始显示图片，并且背景图片右下角与div的右下角重合3.background:url(../image/header.
阅读全文
摘要：一般都是用作实现如下功能，当点击一个超链接的时候，不想出发超链接自带的动作，而触发自定义的js方法，一般与onclick一起出现。如果不写void(0)点击超链接时候虽然调用js方法，但是也会出现一个弹出页面1)点击链接后不做任何事情1.test 2.test 3.test//使用2个到4个#，见的大多是"####"，也有使用"#all"等其他的2)点击链接后，响应用户自定义的点击事件1.test 2.什么问题都解决了,包括浏览器不兼容问题//或者直接使用href=""3.test说明：1.javascript:void(0)属于伪协
阅读全文
摘要：document // Html 的容器对象.document.documentElement //html 对象document.body // body 对象$(document.documentElement).find("body") ; // Body 对象.各个高度有各个高度的含义.document > document.documentElement > body .但是 document.height 却很小.document.body.clientWidth ==> BODY对象宽度document.body.c...
阅读全文
摘要：元素位置重叠的背景常识(x)html文档中的元素默认处于普通流（normal flow）中，也就是说其顺序由元素在文档中的先后位置决定，此时一般不会产生重叠（但指定负边距可能产生重叠）。当我们用css为某个元素指定float浮动或者position定位后，元素的定位将会依情况发生如下改变：1. 指定float值left/right行内元素也会隐形变成块元素，元素会脱离文档的普通流，向左或右浮动，直到其外边缘碰到包含框或另一个浮动框。2. 指定position值relative可以相对于其在普通流中的位置偏移，原本所占的空间仍保留。3. 指定position值absolute行内元素也会隐形变成
阅读全文
摘要：1、为负margin“平反”我们在CSS中都会使用margin，但将margin设置成负数，那可能就不大好处理了。在网页设计中，人们对负margin用法的态度大相径庭，有的人非常喜欢，而有的人则认为这是魔鬼的工作。一个负margin应该是这样设置的：#content {margin-left:-100px;} 通常人们很少使用负margin但随后你会了解到，它能做的其实有很多。以下是几条有关负margin需要注意的地方：A、负margin是绝对标准的CSS这不是开玩笑。W3C甚至标注过：对于margin属性来说，负值是被允许的。这是Nuff说的，查看这篇文章会有更多详细内容。B、负mar...
阅读全文
摘要：现在互联网上提供的社区、博客、免费空间的网站有很多。像交友类的社区网站有myspace、facebook，国内的则有校内、亿聚、占座等，而博客则有像博客中国、新浪博客、博客园等。我学习web前端技术也有一定的时间了，最近在博客园这个国内著名的开发网站上注册了一个帐户。昨天刚考完试，今天周末，有一把时间供自己挥霍。就开始自己整整博客。 当然，自我臭屁一下，作为一个学css的csser。拿模板来对付自己也有点太不负责了吧。好，那我就自己设计一下自己的博客页面吧。 说干就干，具体的小步骤如下： 1：打开自己的博客，在“管理”-“博客设置”中勾选“禁用模板默认CSS”复选框； 2：用firefox的插
阅读全文
摘要：1：速度和加载方式方面的区别div 和 table 的差异不是速度，而是加载方式，速度只能是指网络速度，如果速度足够快，是没有差异的：div 的加载方式是即读即加载，遇到 没有遇到 的时候一样加载 div 中的内容，读多少加载多少；table 的加载方式是完成后加载，遇到 后，在读到 之前，table 中的内容不加载，或者传输中断了(document.onload()事件)的时候加载，这是因为TABLE牵涉到多行多列问题,所以只有当TABLE所有内容加载完毕,IE才知道该怎么显示2：在网页应用中的差别如果页面首尾加 table ，那么必须等整个页面读完了才加载如果页面首尾加 div ，...
阅读全文
摘要：最近项目中使用了一些插件来做页面，这里把jQuery UI的使用分享出来，希望 对新手有帮助。文章结尾附源码下载。1 jQuery UI2 为我所用 2.1 Tabs 2.2 Accordion 2.2.1 使用基本的Accordion 2.2.2 实现打开多个标签 2.2.3 Accordion的嵌套3 给插件应用主题——Theme Roller 3.1 更改配色 3.2 更改图标4 相关连接1 jQuery UI 有时你仅仅是为了实现一个渐变的动画效果而不得不把javascrip 重新学习一遍然后书写大量代码。直到jQuery的出现，让开发人员从一大堆繁琐...
阅读全文
摘要：jQuery为开发插件提拱了两个方法，分别是：jQuery.fn.extend(object);jQuery.extend(object);jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。jQuery.fn.extend(object);给jQuery对象添加方法。fn 是什么东西呢。查看jQuery代码，就不难发现。jQuery.fn = jQuery.prototype = { init: function( selector, context ) {//.... //......};原来 jQuery.fn = jQuery.proto...
阅读全文
摘要：JQuery的extend扩展方法： Jquery的扩展方法extend是我们在写插件的过程中常用的方法，该方法有一些重载原型，在此，我们一起去了解了解。一、Jquery的扩展方法原型是: extend(dest,src1,src2,src3...); 它的含义是将src1,src2,src3...合并到dest中,返回值为合并后的dest,由此可以看出该方法合并后，是修改了dest的结构的。如果想要得到合并的结果却又不想修改dest的结构，可以如下使用： var newSrc=$.extend({},src1,src2,src3...)//也就是将"{}"作为dest参数
阅读全文
摘要：jQuery 参考手册 - 数据.clearQueue()从序列中删除仍未运行的所有项目.clearQueue(queueName)$("div").clearQueue();//清空队列.data()向被选元素附加数据，或者从被选元素获取数据$(selector).data(name)//如果没有规定名称，则该方法将以对象的形式从元素中返回所有存储的数据$(selector).data(name,value)向被选元素附加数据$("#btn1").click(function(){ $("div").data("greet
阅读全文
摘要：.add()add() 方法将元素添加到匹配元素的集合中.add(selector)//字符串值，表示查找供添加到匹配元素集合的元素的选择器表达式。.add(elements)//添加到匹配元素集合的一个或多个元素.add(html)//添加到匹配元素集合的 HTML 片段.add(jQueryObject)//添加到匹配元素集合的已有 jQuery 对象.add(selector, context)//字符串值，表示查找供添加到匹配元素集合的元素的选择器表达式;选择器开始进行匹配的位置。$("div").css("border", "2px
阅读全文
摘要：1.通过item-1查找 level-3(查找直接上级)$('li.item-1').closest('ul') $('li.item-1').parent() $('li.item-1').parents().eq(0) 2.通过item-1查找 level-2(通过选择器查找父元素)$('li.item-1').closest('.level-2') //$('li.item-1').parent('.level-2') //找不到，parent()方法只遍历到上
阅读全文
摘要：这里实际上是匿名函数function(arg){...}这就定义了一个匿名函数，参数为arg而调用函数 时，是在函数后面写上括号和实参的，由于操作符的优先级，函数本身也需要用括号，即：(function(arg){...})(param)这 就相当于定义了一个参数为arg的匿名函数，并且将param作为参数来调用这个匿名函数而(function($){...}) (jQuery)则是一样的，之所以只在形参使用$，是为了不与其他库冲突，所以实参用jQuery**********************************************************************
阅读全文
摘要：做前端多年，虽然不是经常需要hack，但是我们经常会遇到各浏览器表现不一致的情况。基于此，某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的，要知道一名好的前端，要尽可能不使用hack的情况下实现需求，做到较好的用户体验。可是啊，现实太残酷，浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协，虽然这只是个别情况。今天，结合自己的经验和理解，做了几个demo把IE6~IE10和其他标准浏览器的CSS hack做一个总结，也许本文应该是目前最全面的hack总结了吧。什么是CSS hack由于不同厂商的流览器或某浏览器的不同版本（如
阅读全文
摘要：以下方法都是Ajax 事件function(event,xhr,options)event - 包含 event 对象；xhr - 包含 XMLHttpRequest（XMLHttpRequest 对象和设置作为参数传递给回调函数） 对象；options - 包含 AJAX 请求中使用的选项jQuery.ajax().ajaxComplete().jQueryajaxComplete(function(event,xhr,options))//规定当请求完成时运行的函数$("#txt").ajaxStart(function(){ $("#wait").
阅读全文
摘要：如有在jQuery方法中涉及到函数，此函数必定会返回一个数值（函数由于运行次数不同触发一些不同效果）jQuery 属性操作方法（以下方法前些日子学习过，不再赘述）addClass()attr()hasClass()html()removeAttr()removeClass()toggleClass()val()jQuery CSS 操作函数css()$("p").css("color");//取得第一个段落的 color 样式属性的值$(selector).css(name,value)//设置所有匹配元素的指定 CSS 属性$(selector).cs
阅读全文
摘要：欲解决问题，关键在于让Sublime Text 2支持GB2312和GBK。步骤如下：1.安装Sublime Package Control。在Sublime Text 2上用Ctrl+～打开控制台并在里面输入以下代码，Sublime Text 2就会自动安装Package Control。import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else N
阅读全文
摘要：上传图片时页面崩溃。。全部付之东流addClass()after()append()appendTo()attr()before()clone()detach()empty()hasClass()html()insertAfter()insertBefore()prepend()prependTo()remove()removeAttr()removeClass()replaceAll()replaceWith()text()toggleClass()unwrap()val()wrap()wrapAll()wrapinner()
阅读全文
摘要：（speed可选：规定动画的速度。默认是 "normal"，可能的值：毫秒（比如 1500）"slow""normal""fast"）callback可选：当前函数执行完之后，要执行的函数animate()对被选元素应用“自定义”的动画$(selector).animate(styles,speed,callback)$(".btn1").click(function(){ $("#box").animate({height:"300px"});});cl
阅读全文
摘要：事件方法会触发匹配元素的事件，或将函数绑定到所有匹配元素的某个事件。bind()向匹配元素附加一个或更多事件处理器$(selector).bind(event,function)$(selector).bind({event:function, event:function, ...})$("button").bind("click",function(){ $("p").slideToggle();//为button绑定一个click事件和函数});blur()触发、或将函数绑定到指定元素的 blur 事件$(selector).b
阅读全文
摘要：DOM操作的分类1.DOM Core不专属JavaScript，任何一种支持DOM的程序设计语言都可以使用它，也可以处理XML等标记语言编写出来的文档，getElementById()、setAttribute()等都是DOM Core的组成部分2.HTML-DOM专属web文档，document.forms3.CSS-DOM针对CSS操作element.style.color="red"jQuery属性操作方法(与w3school网站结合学习)addClass()向匹配的元素添加指定的类名$("p:first").addClass("intr
阅读全文
摘要：本章节主要Jquery选择器jquery选择器与css选择器十分相似，特别需要注意的是$("#tt")获取的永远是对象，即使没有此元素也不会报错，同理错if($("#tt")){//代码}对if($("#tt").length>0){//代码}或者转换为DOM对象也是对的if($("#tt")[0]){//代码}层次选择器$("ancestor descendant") 空格表示选取祖先元素里所有的此类后代元素；$("parent>child") 大于号表示选取父
阅读全文
摘要：按照书本介绍顺序整理jquery库相关的语法、要点。window.onload与$(document).ready()功能类似，前者需要所有资源加载完毕，且不能同时编写多个；后者加载完DOM结构即执行，且可编写多个按序执行。链式结构（注意代码隔行及备注）$(".level > a").click(function(){ $(this).addClass("current").next().show().parent().sibling().children("a").removeClass("current"
阅读全文
