jq基础2选择器1

html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
    <!--<link href="css.css" type="text/css" rel="stylesheet"/>-->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="jquery-2.1.3.js"></script>
    <script  src="js2.js" ></script>
    <!--<script ></script>-->
</head>
<body>
<div id="div1">id选择器</div>
<span class="div2">class类选择器</span>
<p>你好</p>
</body>
</html>

js

/**
 * Created by Administrator on 2015/4/4 0004.
 */
$(function(){
    $(‘#div1‘).css(‘color‘,‘red‘)
});
$(function(){
    $(‘.div2‘).css(‘color‘,‘blue‘)
})
$(function(){
    $(‘p‘).css(‘color‘,‘red‘)
})
//length or size()返回个数
//$(‘div‘).eq(int).css()获取指定的一个div信息
//在css里面求指定节点如 #box >p{
// key:value}这样表示获取子节点,然后进行设置
/*如
    <div id=‘box‘>
        <p></p>这是子节点
        <div>
            <p></p>这是孙子节点
        </div>
    </div>

*/
/*在jq中处理方法与css类似,如下
        $(‘#box >p‘).css(attr,attr)
        判断节点是否存在
        if($(‘.class‘).size()>0{
            ...}
            判断dom节点是否存在
            $(‘‘).get(int) or $(‘‘)[int]:从0开始)
        */

/*群组选择器*obj,.class,#id{obj,obj}这是css方法* jq使用方法:$(‘obj,.class,#id‘).css(obj,obj)例子:<span></span><p id=id></p><h1 class="class"></h1>后代选择器:ul li a{}$(ul li a).css()

通配符 *{}$(‘*‘).css()可以在选择器前缀加标签$(‘p.class‘)多级类选择器$(.class1.class2).css()

高级选择器1:层次选择器后代选择器$(# p).css()$(‘#id‘).find(p).css()$(标签,id/class).css()子选择器$(‘#id>p‘).css()$(‘#‘).children(p).css()next选择器:要同级$(‘#div+p‘).css()$(‘#‘).next(p).css()nextall()选择器(后面所有同级节点)#id~p{}$(‘#‘).nextAll(p).css()同级上一个节点$(id).prev().css()同级上面全$(id).prevALL().css()同级非指定元素,遇到则停止prevUntil()nextUntil()结合上面2个方法的功能方法如下上下同级siblings()2:属性选择器*/
<a title>aaa</a><a title==bb></a>具有这个属性,且开关进行匹配<a title^==‘bb‘></a>$(‘a[title]‘).css()$(‘a[title==bb]‘).css()<a bb=‘1‘ cc=2></a>$(a[bb==1][cc==2]).css()*/说明(cnds博客查找到的,他的博客地址:http://blog.csdn.net/a85907468/article/details/4494049)jquery的属性选择器分以下几种用法。

$("div[id]")                查找所有含有 id 属性的div元素。$("div[id=‘ajaxa‘]")        查找 id 为 ajaxa 的 div 元素。$("div[id!=‘ajaxa‘]")       查找 id 不为 ajaxa 的 div 元素。$("div[id^=‘ajaxa‘]")       查找 id 以 ajaxa 开头的 div 元素。$("div[id$=‘ajaxa‘]")       查找 id 以 ajaxa 结尾的 div 元素。$("div[id*=‘ajaxa‘]")       查找 id 含 ajaxa 的 div 元素。$("div[id^=‘ajaxa‘]")       查找 id 以 ajaxa 开头的 div 元素。$("div[id][class=‘ajaxa‘]") 查找存在id属性并且类为ajaxa的 div 元素。

http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp过滤选择器1
$(‘li:first‘).css()选择第一个过滤器$(‘li:last‘).css()选择最后一个过滤器如果要指定一个过滤器,使用id,class如下$(‘#id li:last‘).css() or$(‘li:first li:last‘).css()除去指定的id class$(‘li:not(:red)‘).css()*/
 







内容过滤器



可见性过滤器

时间: 07-13

jq基础2选择器1的相关文章

JQ基础之选择器

JQ选择器与CSS/CSS3选择器非常类似,对于学过CSS/CSS3的朋友来说可以是快速上手,下面总结了比较常用的选择器. ID选择器 $('#one') ( '#'代表ID ) CLASS选择器 $('.two')   ( '.'代表类 ) 元素选择器 $('ul') ( 选取'ul'标签 ) $('#one>span') 属性选择器 $('[class]')    ( 所有具有'class'属性的元素 ) $('li[class]')           ( 选中'li'下的具有'class

jq基础2选择器2

子元素选择器 :nth-child('intn').css() intn如3n就是3的倍数 或者 :nth-child('intn+1').css() i 其他方法 dom(1) css css方法属性 jq dom(1)(动态的) 创建节点 var none=$('<div id="box">text</div>') 插入节点(插入到那些位置) $('body').append(none) 插入节点的方法 jq dom(2) 包裹节点 删除节点 表单选择器 常

JQ基础知识

2017-04-19 JQ基础完成复习时间:20:00已经理解的知识点:一.JQ对象: 1.获取JQ对象,需早变量前面加上$: 2.DOM对象转JQ对象: var user = document.getElementById("d"); var $user = $(user); 3.JQ对象转DOM对象: var $user = $("#username"); var user = $user[0]; //也可通过.get(index)方法得到相应的DOM对象二.J

Jquery基础之选择器

选择器是JQuery的根基,在JQuery中对事件处理.选择遍历Dom.ajax操作都依赖选择器.JQuery选择器分为基本选择器.层次选择器.过滤选择器.表单选择器. 一.基本选择器 1.ID选择器$("#ID") 页面中每个ID是唯一的,ID选择器选择每个ID元素,如下方法如下:$("#ID");例:$("#tbxName")这个方法选择id=tbxName的页面元素.选择结果为单个元素. 2.类选择器$(".class"

css基础-css选择器和css文本样式相关

css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 :link-> :visited ->:hover-> :active 或者 : visited -> : link ->:hover-> :active 选择器的优先级: id选择器>class选择器>标签选择器 如果设置了同样的类样式,类样式与元素里类的顺序没

jQuery源代码解析(1)—— jq基础、data缓存系统

闲话 jquery 的源代码已经到了1.12.0版本号.据官网说1版本号和2版本号若无意外将不再更新,3版本号将做一个架构上大的调整.但预计能兼容IE6-8的.或许这已经是最后的样子了. 我学习jq的时间非常短,应该在1月.那时的版本号还是1.11.3,通过看妙味课堂的公开课视频和文档里的全部api的注解学习. 源代码则是近期些日子直接生啃.跳过了sizzle和文档处理的部分(待业狗压力大.工作以后再看).关注data.ready.event.queue.Defferred(jq的promise

css基础与选择器——精通css学习笔记(一)

开篇,作者就告诉了我们正确的学习方式——先用后学.在有了一定的基础之后,就要去尝试着做一些小东西.学的过程中要保持入和出的平衡,不输出就等于没有输入.很多经验总是相同的,类似这样正确的道理,总是在能在各种场合被告诫. 学习css的正确方法,也正是在有了一定的基础知识之后,就要多看源码,多看别人的小例子,尝试着大胆的在自己的网站上应用. 新技术的出现,往往是因为旧技术的局限性所导致,css也是如此.在早期,html被承担了太多"功能".font标签用来控制各种样式,繁琐的表格嵌套用来布局

JQ基础样式篇

1-1 官方网站 http://jquery.com/download/ ,jQuery是一个JavaScript脚本库,不需要特别的安装,只需要我们在页面 <head> 标签内中,通过 script 标签引入 jQuery 库即可. jQuery 分 2 个系列版本 1.x 与 2.x,主要的区别在于 2.x 不再兼容 IE6.7.8浏览器,这样是为了兼容移动端开发.由于减少了一些代码,更小.更快. jQuery 每一个系列版本分为:压缩版(compressed) 与 开发版(develop

从零开始学_JavaScript_系列(四)——jquery(基础,选择器,触发条件,动画,回调函数)

jQuery语法 (1)引用jquery文件及下载库: http://jquery.com/download/ 下载 Download the compressed, production jQuery 2.2.2 这个是用户版的,已经被精简和压缩. 然后使用 <script src="jquery.js"></script> 来启动这个库文件,记得将下载的文件重命名为jquery.js 也可以使用谷歌和微软的CDN,不过这里略. (2)jQuery语法 $ (