jQuery介绍

1 jQuery(JQ)
  作用 大量直接操作DOM 解决兼容问题
dom操作
  操作html: 获取元素 更改标签属性 操作节点
  操作css: 设置或更改css样式
  添加事件
  网页特效

jQuery对象
  是什么:一组DOM元素,所以具有批量操作DOM元素的特点
  $("p") $(".demo") $("#one") $("*") $(".box1 p") $(".box1 p.cur")
  $(".box1,#p1")

jQuery对象与原生js对象进行转化
  jQuery对象--->原生js对象 $("div")[0]
  原生js对象--->jQuery对象 $(原生对象) $(this)

jQuery常用方法
  html("....") ===== innerHTML
  html() alert($("table").html()); 获取内容
  attr() ===== obj.style.width
  addClass()/removeClass()/toggleClass() ===== obj.className
  click(function() {
  })
  mouseover()
  mouseout()
  mousemove()

  css()

  动画方法
    hide/show/toggle 实现原理width/height/opacity
    slideDown/slideUp/slideToggle 实现原理height/display
    fadeIn/fadeOut/fadeToggle/fadeTo 原理opacity/display
    animate()  

  节点
    parent() 必须是亲父亲
    children() 必须是亲儿子
    siblings() 兄弟 

  其他节点关系
    find() 查找后代
    next() 下一个兄弟
    nextAll() 后面所有兄弟

  链式编程   return this  

  $("button:eq(2)")//:eq(2)修饰button,表示第二个button
  $(".box p").eq(1).css("background","green");//集合中的第二个
  $(".box").each()//遍历JQ中DOM对象

posted on 2019-01-07 15:40  悬剑  阅读(143)  评论(0)    收藏  举报

导航