jquery学习之1.7-属性过滤器学习
2014-03-24 11:34
316 查看
属性过滤器学习,主要内容包含:
my Code
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>11</title> <script type="text/javascript" src="js/jquery-1.11.0.js"> </script> <script language="javascript"> $(document).ready(function() { //***********************改变有title的div颜色为#aa0000******** $("#bt1").click( function() { $("div[title]").css("background","#aa0000"); } ); //********改变有title且title值为test的div颜色为#bb0000******** $(".bt2").click( function() { $("div[title='test']").css("background","#bb0000"); //$("div[title=\"test\"]").css("background","#bb0000"); } ); //********改变有title且title值以te开头的div颜色为#110000******** $("#bt3").click(function() { $("div[title^='第一']").css("background","#110000"); }); //********改变有title且title值以st结尾的div颜色为#ff0000******** $("#bt4").click(function(){ $("div[title$='st']").css("background","#ff0000") }); //********改变有id且title值包含div的div颜色为#001100******** $("#bt5").click(function(){ $("div[id][title*='div']").css("background","#001100") }); }); //****************************************************** </script> </head> <body> <input type="button" id="bt1" value="改变div1背景颜色为绿色" ></input> <input type="button" class="bt2" value="改变有title且title值为test的div颜色为#bb0000" ></input> <input type="button" id="bt3" value="改变有title且title值以te开头的div颜色为#110000" ></input> <input type="button" id="bt4" value="改变有title且title值以st结尾的div颜色为#ff0000" ></input> <input type="button" id="bt5" value="改变有id且title值包含div的div颜色为#001100" ></input> <div id="div1" title="第一个div" style="background:grey;border:1px solid;width:20%;height:30%;float:left">div1</div> <div class="div2" title="test" style="background:white;border:1px solid;width:20%;height:30%;float:left"><p>p1第一段</p>p2第二段<p></p></div> <br> </body> </html>
my Code
相关文章推荐
- 【11】jQuery学习——入门jQuery选择器之过滤选择器-表单对象属性过滤选择器
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
- JQUERY1.9学习笔记 之基本过滤器(四) 首元素选择器
- 【jQuery学习笔记---------包裹元素与属性操作】
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
- jQuery学习笔记--jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关属性
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
- jquery-mobile 学习笔记之一(基础属性)
- jQuery源码学习之三 (jQUery对象的实例属性和方法)
- jQuery学习——基础篇(选择器、属性与样式)
- jquery 学习之二 属性(html()与html(val))
- jQuery学习之六---属性
- jQuery 学习八(属性)
- jQuery 学习之路(2):选择器与过滤器
- 一步一步学习 JQuery (四) 过滤选择器:属性过滤选择器 && 子元素过滤选择器 && 表单过滤选择器
- JQUERY1.9学习笔记 之基本过滤器(十一) 奇数选择器
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
- jQuery学习3:操作元素属性和特性
- JQuery学习笔记7:element属性控制