1、第一个jq程序

  a、jq对象和dom对象的方法不能混用

  b、dom对象转换成jq对象$(dom),jq对象转换成dom对象jq[0],转换之后方法就可以使用了

2、jq选择器

  基本选择器

  $('body') //标签选择器

  $('#btn') //id选择器

  $('.class') //类选择器

   $('p:odd') //奇偶行选择器
$('p:even')
$('p:first') //页面中的第一个p
$('p:last')
$('p:first-child') //p的父元素的第一个子元素p
$('p:first-last')
$('p:nth-child(1)') //p的父元素的第一个子元素p
$('p:nth-of-type(2)') //p元素是其父元素的第2个p元素
$('p:nth-last-of-type(2)') //倒序

  额外选择器

    $('div:has(a)') //里面包含a标签的div
$('a[title]') //属性选择器有title属性的a
$('a[href^=www]') //以www开头的href值的a
$('a[href$=pdf]') //以pdf结束的href值的a
$('a[href="www.jfidg"]') //href值为www.jfidg的a
$('a[href*=www]') //href属性值里包含www的a
$('input[type=button]')
$(':button') //获取所有的按钮
$(':disabled') //所有被禁用的元素

3、jq基本方法

    $('div').eq(2) //第二个div
$('div:eq(2)') //eq也可以写在里面
$('div:gt(2)') //第二个div后面的一个div(此方法只能写在里面)
$('div').eq(2).siblings() //获取第二个div的兄弟元素
$('span').not(':eq(2)') //不包括第二个的span
$('input').not(':button')
$('span').filter(':eq(2)') //刷选出第二个
    $(".d1").parent() //找到类为d1的一级父元素
$(".d1").parents() //找到类为d1的所有的祖先父元素
$(".d1").children() //找到子元素
$(".d1").prev() //同一级的上一个
$(".d1").prevAll() //同一级的所有的
$(".d1").next() //下一个
$(".d1").nextAll()

4、jq链

    $("div").find("p").addClass("c2").addClass("c1")
$("div").find("p").addClass("c2").end().addClass("c1") //end是当前结果级的上一个结果,此处是div
$("div").find("p").addClass("c2").endSelf().addClass("c1") //endSelf表示给当前结果和当前结果的上级都加

5、jq额外方法

    $("div").attr("title") //获取属性值
$("div").attr("title","aaaa") //设置属性值
$("div").attr({"title":"aaaa","id":"d3"}) //设置多个属性值
$("#d4").html() //获取所有,加上参数也可以设置内容
$("#d4").text() //获取文本
$("#d2").hasClass("c1") //判断是否含有c1类
$("#d1").is("p") //判断是否是p元素
    $("div").addClass("d1").filter(function (index) {
return index==1 || $(this).attr("id")=="d3" //index索引
}).addClass("c2"); $("div").append("<p>你好</p>") //追加内容
$("<p>你好</p>").appendTo('#d1') //加到某个元素中
$("<p>你好</p>").insertBefore('#d1') //插入到d1前面
$("<p>你好</p>").insertAfter('#d1') //插入到d1后面
$("div").mousemove(function () {
//鼠标移入
})
$("div").mousedown(function () {
//鼠标移出
})
$("div").hover(function () {
//移入事件
},function () {
//移出事件
})
    $('div').size() //获取div的数量
$('div').css('color','red') //添加样式,设置的是行内样式,权重比较高
$('div').css({'color':'red','font-size':'14px'})
$('div').addClass('className') //添加类名,一般用于样式修改
$('div').removeClass('className') //一次类名
$('div').find('p') //查询元素

最新文章

  1. JavaScript禁用回退
  2. Perl语言
  3. 对比poj3050
  4. ASP.NET MVC下判断用户登录和授权的方法
  5. javascript异步延时载入及推断是否已载入js/css文件
  6. MVC 模型js远程校验的使用方法
  7. iOS开发之隐藏tabbar--解决隐藏后依然不能响应对应位置事件的问题
  8. LeetCode 122. Best Time to Buy and Sell Stock II (买卖股票的最好时机之二)
  9. javascript中正则表达式和ruby中的一点差异
  10. python 2.7 数据结构: 基础面试总结
  11. Mac OS 安装robotframework
  12. ASP.NET 文件操作类
  13. jpush在有网的情况下6002
  14. Oracle EBS OPM 发放生产批
  15. thinkphp5学习总结!
  16. android中使用toolbar
  17. 微软BI 之SSRS 系列 - 不显示 Pie Chart 饼图上 0% 的数据
  18. unity抗锯齿(Antialiasing)
  19. windows7 服务中上找不到mysql
  20. NBUT 1218 You are my brother

热门文章

  1. DataTable的数据或表结构复制
  2. C3p0 的一个异常
  3. 解决stackoverflow打开缓慢的问题
  4. VS2008 试图运行未注册64位调试器组件
  5. Boto Config File
  6. 团队项目个人进展——Day07
  7. 回归JavaScript基础(十)
  8. Problem2-Project Euler
  9. LeetCode 题解之 Two Sum
  10. PHP剔除删除掉危险字符