摘要：
jQuery选择器(Selectors,或译为选择符?)可以说是甚为强大,jQuery能够得以如此之名气,选择器的功劳是功不可没的.利用 CSS和XPath选择符的能力,加上自己的”自定义选择符”,几乎无所不能的操作DOM,轻松的获取DOM中的任意元素和元素组.So,掌握好 jQuery选择器,对于jQuery的学习就前进了一大步,最终发挥你的想象力,即可写出优雅高效的CODE;而对于新手而言,如何选择DOM中的元素 是一个问的最多的问题.jQuery官方API中有列出详细的信息,可以移步至:Selectors.一、jQuery选择器 – 基本(Basics)在继续学习之前,我们必须具备一些. 阅读全文
posted @ 2013-06-06 15:59
moyiqun
阅读(144)
评论(0)
推荐(0)
摘要：
jQuery的each函数可调用选择器得到的元素集进行循环调用。这意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的 DOM元素（每次都是一个不同的匹配元素）。而且，在每次执行函数时，都可以给函数传递一个表示作为执行环境的元素（index），在匹配的元素集合中所 处位置的数字值作为参数（从零开始的整形）。一、遍历以下面的HTML为例：引用<li>0</li><li>1</li><li>2</li><li>3</li><li>4</li><li> 阅读全文
posted @ 2013-06-06 15:58
moyiqun
阅读(173)
评论(0)
推荐(0)
摘要：
jquery 实现一个简单选中功能。<input type="checkbox" id="cr"/> <lable for="cr"> 我已经阅读了上面制度.</lable>通过$("#cr")获取到复选框元素，然后通过判断复选框是否被选中，来执行下一步操作。首先，用DOM 方式来判断复选框是否被选中,代码如下:$(document).ready(function(){var $cr = $("#cr");var cr = $cr[0];$cr.click(f 阅读全文
posted @ 2013-06-06 14:56
moyiqun
阅读(122)
评论(0)
推荐(0)
摘要：
单击产品小图片时，上面对应的大图片需要切换，并且大图片的放大镜效果和遮罩效果也必须同时切换。实现这个效果并不难，但为了使程序更加简单，需要为图片使用基于某种规则的命名。例如为小图片命名blue_one_small.jpg ,为大图片命名为blue_one_big.jpg这样就可以很容易地根据单击的图片(blue_one.jpg)来获取相应的大图片和小图片，代码如下:$(funciton(){$(".pro_detail_left ul li img").click(function(){var imgSrc=$(this).attr("src");var 阅读全文
posted @ 2013-06-06 14:55
moyiqun
阅读(137)
评论(0)
推荐(0)
摘要：
<div class="ad" ><ul class="slider" ><li><img src="images/ads/1.gif"/></li><li><img src="images/ads/2.gif"/></li><li><img src="images/ads/3.gif"/></li><li><img src="image 阅读全文
posted @ 2013-06-06 14:54
moyiqun
阅读(236)
评论(0)
推荐(0)
摘要：
$(function()){var page = 1;var i=4;//每版放4个图片var len = $(".prolist_content ul li").length;var page_count=Mach.ceil(len/i);//只要不是整数，就往大的方向取最小的整数var none_unit_width=$(".prolist").width();//获取框架内容的宽度，不带单位var $parent=$(".prolist_content");//向右移动按钮$(".goRight").clic 阅读全文
posted @ 2013-06-06 14:53
moyiqun
阅读(147)
评论(0)
推荐(0)
摘要：
在IE7中firefox浏览器上可以使用伪劣:hover来显示导航效果，但是IE6并不支持除超链接外的元素使用这个伪类。在IE六下 hover css 无法运行#navigation ul li:hover ul{background-color:#88c366;position:absolute;widht:100px;display:block;}为<li>元素添加hover事件，jQuery代码如下:$(function(){$("#navigation ul li:has(ul)").hover(function(){ //鼠标移动过来,向下滑动显示菜单 阅读全文
posted @ 2013-06-06 14:52
moyiqun
阅读(169)
评论(0)
推荐(0)
摘要：
jQuery 实现的一个简单的选项卡。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text 阅读全文
posted @ 2013-06-06 14:51
moyiqun
阅读(118)
评论(0)
推荐(0)
摘要：
$.ajax()方法是jQuery最底层的Ajax实现。它的结构为:$ajax(options);这个对象里包含了$.ajax()方法所需要的请求设置以及会掉函数信息，参数以key/value 的形式存在，所有参数都是可选的，常用参数如表 6-3所示。参数名称 类型 说明url string (默认为当前页地址)发送请求的地址type string请求方式(post或get)默认为get，注意其他http请求方法，例如put和delete 也可以使用。timeout Number 设置请求超时时间(毫秒)，此数值将覆盖$.ajaxSetup()方法得全局设置。data object 发送到服务 阅读全文
posted @ 2013-06-06 14:50
moyiqun
阅读(263)
评论(0)
推荐(0)
摘要：
jQuery中的AjaxjQuery对Ajax操作进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第2层是load(),$.get()和$.post()方法，第三层是$.getScript()和$.getJson()方法。首先介绍第2层得方法，使用效率很高。load()方法1.载入HTML文档load()方式jQuery中最为简单的Ajax方法，能载入远程HTML代码并插入DOM中，它的结构为:load(url[,data][,callback]);load()方法参数解释如表6-1所示。load参数说明：参数名称 类型 说明url string 请求html的url地址da 阅读全文
posted @ 2013-06-06 14:48
moyiqun
阅读(134)
评论(0)
推荐(0)
摘要：
案例研究 网站的超链接和图片提示1.超级链接提示效果浏览器已经自带了超级链接提示，只需要在超链接中加入title属性就可以了。HTML 代码如下:<a href="#" title="这是我的超链接提示1.">提示</a>然二这个提示效果的响应速度是非常缓慢的，考虑到良好的人机交互，需要的是鼠标移动到超级链接的那一瞬间出现提示，这时就需要移除<a>标签中的title提示效果，自己动手做一个类似功能的提示。首先在空白的页面上，添加两个普通超级链接和两个带有class的超级链接。<p><a href=&q 阅读全文
posted @ 2013-06-06 14:47
moyiqun
阅读(129)
评论(0)
推荐(0)
摘要：
jQuery 对表单，格的操作Text 操作<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="t 阅读全文
posted @ 2013-06-06 14:46
moyiqun
阅读(138)
评论(0)
推荐(0)
摘要：
jQuery中的动画 一 show() 和hide()方法show()方法和hide()方法是jQuery中最基本的动画方。调用hide 会将元素的display样式改为"none"element.css("display","none"); //通过css方法隐藏元素。调用show()方法将元素的dispaly样式设置为先前的显示状态("block","inline"或其他除了"none"之外的值)。$("element").show();show()方 阅读全文
posted @ 2013-06-06 14:45
moyiqun
阅读(119)
评论(0)
推荐(0)
摘要：
DOM操作的分类DOM Core 并不专属于javascript，任何一种支持DOM的程序设计语言都可以使用它。它的用途并非仅限与处理网页，也可以用来处理任何一种使用标记语言编写出来的文档。例如XMLjavascript中的getElementById(),getElementByTagName(),getAttribute()和setAttribute()等方法，这些都是Dom Core的组成部分。使用DOM Core来获取表单对象的方法document.getElementByTagName("from");使用DOM Core来获取某元素的src属性的方法：eleme 阅读全文
posted @ 2013-06-06 14:44
moyiqun
阅读(115)
评论(0)
推荐(0)
摘要：
案例研究 1. 用户进入该页面时，品牌列表默认是精简显示的(即不完整的品牌列表)。2. 用户可以单击商品列表下方的"显示全部品牌"按钮来显示全部的品牌。单击"显示全部品牌"按钮的同时，列表会将推荐的品牌的名字高亮显示，按钮里德文字也换成了"精简显示品牌"。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 阅读全文
posted @ 2013-06-06 14:40
moyiqun
阅读(267)
评论(0)
推荐(0)
摘要：
jQuery 改写 javascript代码 例子1：给网页中所有的<p>元素添加onclick事件。例子2：使用一个特定的表格隔行变色。例子3 对多选框进行操作，输出选中的多选框个数。使用jQuery选择器重写例子$("p").click(function(){ //doing something!})<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transition 阅读全文
posted @ 2013-06-06 14:38
moyiqun
阅读(155)
评论(0)
推荐(0)
摘要：
jQuery 选择器例子1：给网页中所有的<p> 元素添加onclick事件。<p>china</p><p>english</p>(1) 获取所有的<p> 元素。(2) 对<p> 元素进行循环(因为获取的是数组对象)。(3) 给每一个<P>元素添加行为事件。javascript 代码如下:var items = document.getElementByTagName("p"); //获取网页中所有的P元素for(var i=0;i<items.length;i++){ / 阅读全文
posted @ 2013-06-06 14:36
moyiqun
阅读(162)
评论(0)
推荐(0)
摘要：
jquery 学习之代码风格对于同一个对象的较多操作，建议每行写一个操作，代码如下：$(this).removeClass().addClass().stop().fadeTo("fast",0.6).fadeTo("fast",1).unbind("click").click(function(){// do something!});对于上面的代码，如果嫌代码行数过多，可以以功能块来进换行。上段代码中，前两个是对class 的操作，接下来3 事动画操作，最后是取消并重新绑定click的事件的处理函数的操作，所以可以写成如下格式的代 阅读全文
posted @ 2013-06-06 14:34
moyiqun
阅读(155)
评论(0)
推荐(0)
摘要：
1.等待dom元素加载完毕. <script type="text/javascript">//传统写法window.onload= function(){alert("test1");}//jquery写法$(document).ready(function(){$("#one").html("book");});//jqeury简写 $(function(){//})</script>2.jquery 对象和dom 对象<!DOCTYPE html PUBLIC "-// 阅读全文
posted @ 2013-06-06 14:33
moyiqun
阅读(104)
评论(0)
推荐(0)
浙公网安备 33010602011771号