我们使用热门的jquery进行设计,同时我们选择效果比较优秀的boxy弹出插件进行扩展(关于boxy的相关资料,请参照张鑫旭博客http://www.zhangxinxu.com/wordpress/?p=318)。下面介绍boxy作为选择器框架的应用。 对于选择器,相信用过招聘网站的人都不会陌生(就是那个点击就弹出的,选择行业、职位和地区的东西),选择器难点就在于样式调试,主要针对的是IE6。这里介绍行业、职位和地区选择器,下载的Demo包含这三个选择器。 行...
#id 根据给定的ID匹配一个元素。 Matches a single element with the given id attribute. 返回值 Element 参数 id (String) : 用于搜索的,通过元素的 id 属性中给定的值 示例 查找 ID 为"myDiv"的元素。 HTML 代码: <div id="notMe"><p>id="notMe"</p></div><div id="myDiv">id="myDiv"</div> jQuery 代码: $("#myDiv"); 结果: [ <div id="myDiv">id="myDiv"</div> ]-------------------------------------------------------...
:hidden 匹配所有的不可见元素,input 元素的 type 属性为 "hidden" 的话也会被匹配到 Matches all elements that are hidden, or input elements of type "hidden". 返回值 Array<Element> 示例 查找所有不可见的 tr 元素 HTML 代码: <table> <tr style="display:none"><td>Value 1</td></tr> <tr><td>Value 2</td></tr></table> jQuery 代码: $("tr:hidden") 结果: [ <tr style="display:none"><td>Value 1</td></tr> ] --...
:first 匹配找到的第一个元素 Matches the first selected element. 返回值 Element 示例 查找表格的第一行 HTML 代码: <table> <tr><td>Header 1</td></tr> <tr><td>Value 1</td></tr> <tr><td>Value 2</td></tr></table> jQuery 代码: $("tr:first") 结果: [ <tr><td>Header 1</td></tr> ] --------------------------------------------------------------------------------------- :last 匹配找到的最后一个元素 Match...
:nth-child(index/even/odd/equation)匹配其父元素下的第N个子或奇偶元素 ':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素。:nth-child从1开始的,而:eq()是从0算起的! 可以使用:nth-child(even):nth-child(odd):nth-child(3n):nth-child(2):nth-child(3n+1):nth-child(3n+2) Matches the nth-child of its parent. While ':eq(index)' matches only a single element, this matches more then one: One for eac...
Jquery选择器 $(document).ready(function(){}) $(function(){}) 如果获取的对象是jQuery对象,那么在变量前面加上$,例如:var $variable=jQuery对象 选择器 1, 判断页面是否存在某元素:if($(“#tt”).length>0){} 或者if($(“#tt”)[0]){}; 2, 基本选择器$(“#test”) 选择id为test的元素$(“.test”)选择class为test的所有元素$(“p”)选择所有的<p>标签$(“*”)选择页面上的所有元素$(“span ,#two”)选择页面上所有的<span>...
from: 颜色选择器 colorpickerhttp://jscolor.com/http://dematte.at/colorPicker/http://www.free-color-picker.com/color-picker-samples.phphttp://www.nogray.com/color_picker.phphttp://www.mattkruse.com/javascript/colorpicker/ColorPicker2.js代码 代码如下:// =================================================================== // Author: Matt Kruse <matt@mattkruse.com> // WWW: http://www.mattkruse.com/ //...
一.摘要 本章讲解jQuery最重要的选择器部分的知识. 有了jQuery的选择器我们几乎可以获取页面上任意的一个或一组对象, 可以明显减轻开发人员的工作量. 二.前言 编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如"拥有title属性并且值中包含test的<a>元素", 完成这些工作只需要编写一个jQuery选择器字符串. 学习jQuery选择器是学习jQuery最重要的一步. ...
基本选择器:$("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素$("div") 选择所有的div标签元素,返回div元素数组$(".myClass") 选择使用myClass类的css的所有元素$("*") 选择文档中的所有的元素可以运用多种的选择方式进行联合选择:例如$("#myELement,div,.myclass")层叠选择器: $("form input...
效果如图所示:下面是获取系统自带的颜色选择器的代码:function $(obj) { return document.getElementById(obj); } function pickColor() { if (!window.isIE) return; var sColor = $('dlgHelper').ChooseColorDlg(); var color = sColor.toString(16); while (color.length [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]优点是:代码比较少缺点是:只能IE下使用。
通过网上咨询使用这个选择器便很容易的解决。特此记录一下。 下面是主要的代码 js脚本: 代码如下:<script type="text/javascript"> $(document).ready( function () { //每隔五行给li加一个样式 $(.article_li li:nth-child(5n)).addClass(liborder); $(.article_li li:last).addClass(liborder); } ); </script> html代码: 代码如下:<ul class="article_li"> <li> <label class="datename"> <span>2010-06-12 08:37:59 </spa...
根据 id 选择(通过 id 只能选择一个对象), 如: $("#div2") 代码如下:<div id="div1">AAA</div> <div id="div2">BBB</div> <div id="div3">CCC</div> 根据标签选择, 如: $("span") 代码如下:<div><span>AAA</span></div> <div>BBB</div> <span>CCC</span> 根据样式的类名选择, 如: $(".class1") 代码如下:<div class="class1">AAA</div> <div class="class2">BBB</div> <div class="class1">CCC</div> 选择所有对象是: $("*")...
//jQuery 选择器 $ //$(expression,[context]) return jQuery //Unit One //expression 之 CSS 定义符 就是以CSS语法表示所要选择的元素 // $("*"); // 表示页面所有元素标签 // $("th, td") // 表示所有<th><td>元素标签 // $("a") // 表示所有<a>元素标签 // $("div#onlydiv"); // 表示CSS选择中id=onlyidv的元素 $("#ID")为全文档匹配 // $("#rating"); // 表示id=rating的元素 // $("#orderedlist > li"); // 表示id=orderedli...
contains选择符 contains选择符是指对象中包括指定内容的对象本身,如:$('td:contains("abcd")').addClass('highlight');则是找到所有包含“abcd”这样内容的单元格,设置这些单元格的样式类型添加“highlight”类。 下面的代码,运行后,需要刷新下,以便加载jquery$(document).ready(function(){ $("div:contains('John')").css("text-decoration", "underline"); }); John Resig George Martin Malcom John Sinclair J. Oh...
在jQuery出世以来,它取得很大的成就和认同。JQuery是一个轻量级的JavaScript框架,它的发布版很小仅16K左右。它能让你方便简洁的写出漂亮的动画效果、实现各种视觉效果,轻松的处理JavaScript的DOM数以及Ajax的交互行为。它的优点在于轻量级、简单易学、易扩展、跨浏览器和网上拥有大量的jQuery插件使用。由于它这一大堆的优点,它已经被微软官方认可加入VS IDE中拥有强大的智能提示,并据官方的统计现在至少有20%的国际性大网站已...