【常用jQuery选择器总结 (二)】教程文章相关的互联网学习教程文章

jquery属性选择器not has怎么写 行悬停高亮显示

代码如下:$(function(){ /* //$("html body div table.table_list tbody tr").not(":has(td a img[src*=tj.gif])").mouseover(function(){ $("html body div table.table_list tbody tr:not(:has(td a img[src*=tj.gif]))").mouseover(function(){ //alert($(this)[0].style.backgroundColor); $(this).css("backgroundColor","66CCFF");// "red" "#f8fbfd" $(this).mouseout(function(){ $(this).css("backgroundColor","");//$(t...

jquery选择器-根据多个属性选择示例代码

根据多个属性选择E[attr=val][attr=val] $("div[title='ttt'][class='aaaa']").click()................ 所有div元素下所有属性title值是等于ttt并且属性class等于aaaa的元素

jQuery 属性选择器element[herf*='value']使用示例

一个针对jQuery属性选择器的小例子,增加对jQUery属性选择器的理解: 代码如下:<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <style type="text/css"> a{ margin-right:20px; } ol{ position:relative; width:600px; margin-left:400px; } dt{ margin:10px; height:100px; background-color:#EAEAEA; border:3px dotted orange; } .showMessag...

关于jquery的多个选择器的使用示例

代码如下:<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#add,#edit").bind("click",function(){ $("p").slideToggle(); }); }); </script> </head> <body> <p>This is a paragraph.</p> <div id=add>add</div> <div id=edit>edit</div> </body> </html>

jquery的选择器的使用技巧之如何选择input框

下面的方法是选择name是redthree的 并且选中了的input 里面的 title属性的内容 <input name="redTrdd" title='xiaoming'> 代码如下:xtest = $(":input[name=radThree][checked]").attr("title");

jquery选择器、属性设置用法经验总结【图】

本人是一名小白,应届毕业生,以前没用过jquery,最近做项目用到了jquery。在做的过程中走了很多弯路,不停的搜索。总结出了一些用法,供大家参考: 最基本的选择器语法包括:id、class、标签、属性,这和css选择器是一致的。 ID选择器要在ID前加#,比如要选择一个ID为myDivID的div元素(<div id="myDivID"></div>)可以这样写: 代码如下:$("#myDivID"); D是不能重复的,所以ID选择器选出来的是一个jquery对象。 class选择器要在...

jQuery选择器中含有空格的使用示例及注意事项

此文摘自《锋利的jQuery》,另外添加了一点自己的东西 选择器中的空格是不容忽视的,多一个空格或少一个空格也许得到的结果会截然不同的。下面来看一个例子。 先构建如下的HTML代码: 代码如下:<div class="test"> <div style="display:none;">Jquery教程</div> <div style="display:none;">Jquery学习</div> <div style="display:none;">Jquery插件</div> <div class="test" style="display:none;">PHP学习</div> </div> <div cl...

jquery 层次选择器siblings与nextAll的区别介绍

HTML代码: 代码如下:<div> <div >1</div> <div class="one"> 2 <div>2_1 <div>2_1_1</div> </div> <div>2_2</div> </div> <div>3</div> <div>4</div> </div> $(".one div").css("background","red") // .one之后所有DIV后代元素(后代:包括儿子和孙子.....) $(".one > div").css("background","red") // .one之后的子元素。(子:儿子和女儿....) $(".one + div").css("background","red") // .one之后相邻的元素。就是紧靠.on...

jQuery之日期选择器的深入解析【图】

1:默认情况下,日期输入文本框获得页面焦点的时候,日期选择器组件会在一个覆盖层中打开日历选择面板,当日期输入文本框失去焦点或者选择一个日期的时候,将自动关闭该日历选择面板$(selector).datepicker([options]);简单实例: 代码如下:<!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 h...

基于jQuery选择器的整理集合

jquery对象访问1、each(callback):以每个匹配的元素作为上下文来执行一个函数,return false;停止循环;return true;跳至下一个循环。 来个实例 : 代码如下:$("img").each(function(){ $(this).toggle("example");}) 2、size()与length相同,都是返回jquery对象中元素的个数。 $("img").size();或$("img").length; 3、get():取得所有匹配的DOM元素集合(注意返回是dom对象,而非jquery对象) 代码如下:$("img").get().reve...

使用jQuery内容过滤选择器选择元素实例讲解

代码如下:<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- 内容过滤选择器:根据元素中的文字内容或所包含的子元素特征获取元素,其文字内容可以模糊或绝对匹配进行元素定位 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中,在过滤选择器中有可以分为:简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过...

jQuery层次选择器选择元素使用介绍

代码如下:<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- 1.层次选择器: 通过DOM元素间的层次关系获取元素,其主要的层次关系包括后代、父子、相邻、兄弟关系,通过其中基类关系可以方便快捷地定位元素 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中,在过滤选择器中有可以分为:简单过滤选择器、内容过滤选择器、可见性过滤选择...

jQuery基本选择器选择元素使用介绍

代码如下:<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- 1.基本选择器:是jQuery中使用最频繁的选择器,它由元素Id、Class、元素名、多个选择符组成,通过基本选择器可以实现大多数页面元素的查找 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中,在过滤选择器中有可以分为:简单过滤选择器、内容过滤选择器、可见性过滤选择器、...

在jQuery中 常用的选择器介绍

层次选择器: $(div p);//选取div下的所有的p元素 $(div>p).css(border,1px solid red);//只选取div下的直接子元素 //相邻的元素 $(div ~ p).css(border,1px solid red);与$(div).nextAll(p)等价;//表示div后面的 所有p兄弟元素 $(div ~ *).css(border,1px solid red);//表示div后面的所有兄弟元素 $(div +p).css(border,1px solid red);与$(div).next(p)等价//这种写法表示div后 只找紧挨着的第一个兄弟元素,并且该元素是p。 获...

JQuery 中几个类选择器的简单使用介绍

代码如下:<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestClassSelector.aspx.cs" Inherits="WebApplication1.TestClassSelector" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="Scripts/jquery-1.9.0.min.js"></script> <style type="text/css"> .first_div { background-color:red; } .second_div { background-color:green; } .first_...