jQuery（三）

1、jQuery元素操作

• 遍历、创建、添加、删除
• 遍历
  • 遍历元素 ：
  • 相同元素设置不同效果
  • 语法1：
    $('获取元素').each(function(index, element){})
    • index当前元素的索引
    • element:得到的是当前遍历到的元素，是一个DOM对象
    • 使用时需要使用$(element)
  • 遍历数据（数组、对象）
    • 语法2：
      $.each(object, function(index, element){})
      • index当前元素的索引
      • element:得到的是当前遍历到的元素，是一个DOM对象
      • 使用时需要使用$(element)
• 创建元素
  • $('标签')
• 追加元素
  • 内部添加 —— 父子关系
    • 放在元素里面的最后
      • .append() 父元素调用
      • .appendTo() 子元素调用
    • 放在元素里面的最前
      • .prepend() 父元素调用
      • .prependTo() 子元素调用
  • 外部添加 —— 兄弟关系
    • 放在目标元素后面
      • .after()
    • 放在目标元素前面
      • .before()
• 删除元素
  • 删除整个元素
    • .remove() 全部清空，包括标签本身
    • .empty() 清空内容，标签还在
    • .html('') 效果和 empty() 一样，标签还在

2、jQuery获取尺寸

• 获取的值是数值类型
• 不写参数获取
• 写参数设置
• width()、height()
  • 获取盒子大小，只获取内容大小
• innerWidth()、 innerHeight()
  • 包含 padding + width
• outerWidth()、outerHeight()
  • 包含 border + padding + width
• outerWidth(true)、outerHeight(true)
  • 包含 margin + border + padding + width

3、jQuery获取位置

• offset()
  • 设置或获取元素偏移
  • 相对于文档的偏移，跟父级没有关系
  • 得到一个对象，有两个属性 left 和 top
  • 可以设置值 .offset({left: 30, top: 50})
• position()
  • 智只能获取元素偏移
  • 相对于带有定位的父级的偏移坐标，如果父级没有定位，则获取相对于文档的偏移坐标
  • 得到一个对象，有两个属性 left 和 top
• scrollTop()、scrollLeft()
  • 设置或获取元素被卷进去的头部和左侧的长度
  • 不写参数是获取
  • 写了参数是设置
• scroll事件
  • 滚动事件（谁有滚动条加给谁）