简明现代魔法 -> JQuery

JQuery 学习:切换HTML元素的显示与隐藏

toggle()的用法

toggle( )的用法:$("p").toggle()切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。点击 toggle( Function even, Function odd )每次点击时切换要调用的函数每次点击时切换要调用的函数。

发布于 2010-05-13 分类:jquery

JQuery 常用技巧介绍

简洁快速灵活的 JavaScript 框架

随着 Web2.0 及 Ajax 思想在互联网上的快速发展传播,陆续出现了一些优秀的js框架,其中比较著名的有 Prototype、YUI、jQuery、mootools、Bindows 以及国内的 JSVM 框架等,通过将这些JS框架应用到我们的项目中能够使程序员从设计和书写繁杂的JS应用中解脱出来,将关注点转向功能需求而非实现细节上,从而提高项目的开发速度。

发布于 2010-05-12 分类:jquery

JQuery 学习:选取临近节点

next() 函数的使用

next() 函数取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。这个函数只返回后面那个紧邻的同辈元素,而不是后面所有的同辈元素。可以用一个可选的表达式进行筛选。就是说,span 匹配的所有 p 中,离它最近的 p (欢迎来到简明现代魔法!)会被选中,然后输出它的 HTML 内容。

发布于 2010-05-07 分类:jquery

JQuery 学习:选取父节点

parents()函数的使用

parents( String expr ) 取得一个包含着所有匹配元素的唯一祖先元素的元素集合(不包含根元素)。一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态。 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。

发布于 2010-05-06 分类:jquery

JQuery 学习:选择表格中的一行高亮

toggleClass()函数的使用

单击表格中的一行,该行的背景会变成黄色。再点一下,它就切换回正常形式。jQuery toggleClass(String class) 函数的作用是,如果存在(不存在)就删除(添加)一个类。所以使用这个函数可以很方便地实现本例中高亮与取消高亮的效果。

发布于 2010-05-05 分类:jquery

JQuery 学习:鼠标移动变色效果

hover()函数的使用

在某些场合,响应鼠标移动变色可以带来很好的用户体验。比如在表格或者列表中,鼠标移过的时候背景变成淡淡的蓝色,可以帮助用户知道他所在的那一行。用户体验都是从小的细节慢慢积累开来的。

发布于 2010-05-04 分类:jquery

JQuery 学习:追加HTML元素内容

append 和 appendTo 的用法

这里我们必须知道一点,就是 append 和 appendTo 的区别:append 单纯的内容,appendTo 要把内容传给某个元素。这个函数的用法有很多,比如你可以按需要追加form,在区域内追加图片等等都是可以的。

发布于 2010-05-02 分类:jquery

JQuery 学习:展开与收起HTML元素内容

让你的内容显示更加灵活

$(document).ready(function(){}); 获取标签能直接 $("标签")。给标签注册 onclick事件直接可以 click。 slideToggle(speed, callback) 通过高度变化来切换所有匹配元素的可见性,并在切换完成后可选地触发一个回调函数。这个动画效果只调整元素的高度,可以使匹配的元素以“滑动”的方式隐藏或显示。

发布于 2010-05-01 分类:jquery

JQuery 中的原型分析

函数对象都有一个默认的属性 prototype

在 JavaScript 中,每个函数对象都有一个默认的属性 prototype,称为函数对象的原型成员,这个属性指向一个对象,称为函数的原型对象,当我们每定义了一个函数的时候,JavaScript 就创建了一个对应的原型对象,也就是说,当我们定义一个函数的时候,实际上得到了两个对象,一个函数对象,一个原型对象。

发布于 2010-04-28 分类:jquery

JQuery 学习:渐隐HTML元素的内容

让某个HTML元素渐渐消失

这个特效用 hide() 方法实现,有些酷。span 元素的点击事件是 hide,将内容隐藏掉。JQuery 很好玩,利用它可以非常方便地操纵 DOM。

发布于 2010-04-23 分类:jquery

JQuery 学习:改变HTML元素的内容

show() 和 html() 的使用

首先增加样式,然后用 show() 显示隐藏的匹配元素,html("foo") 设置每一个匹配元素的 html 内容。上述 JQuery 实现了什么呢?首先,它找到 span 的 HTML 元素,然后给它加上名为 nowamagic 的 CSS 样式,再把这个 HTML 的元素的换成 html() 方法内的参数。

发布于 2010-04-22 分类:jquery

JQuery 学习:给标签追加 CSS

增加或移除元素的css class

今天我们要做的事情是,增加或移除元素的css class。比如以下代码,可以将 id 为 nowamagic 的 HTML 元素加上名为 addCss 的样式。$(document).ready(function(){ $("#nowamagic").addClass("addCss"); }); {$(

发布于 2010-04-21 分类:jquery

JQuery 学习:鼠标点击触发事件

鼠标点击超链接时触发某些行为

首先,我们尝试鼠标点击超链接时触发某些行为。在ready函数里加入以下代码:$(document).ready(function(){ $("span").click(function(){ alert("Hello NowaMagic");}); }); elector 设定为 span,当点击的时候触发后面的函数。

发布于 2010-04-20 分类:jquery

JQuery 学习:ready 事件

DOM对象就绪即可执行

访问 HTML 文档的元素,必须先载入文档对象模型(DOM)。当 window.onload 函数执行的时候,说明所有东西已经载入,包括图像和横幅等等。要知道较大的图片下载速度会比较慢,因此用户必须等待大图片下载完毕才能看到 window.onload() 执行的代码效果,这样就花费了很长的等待时间,这不是我们想要的。

发布于 2010-04-19 分类:jquery

JQuery Ajax 全解析

用JQuery来实现Ajax功能

jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯。我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()。

发布于 2010-03-16 分类:jquery
 

copyright © 2009 简明现代魔法    学习、分享、进步

power by Gonn 感谢所有关心和支持本站的朋友们