jQuery 特殊属性操作

1.val()方法

  val 方法用于设置和获取表单元素的值，例如：input textarea的值

  设置：$("input").val('helle world')
  
  获取：$("input").val()

2.html()方法与text()方法

  html()方法相当于innerHTML text()方法相当于innerText

  html():
  设置：$('div').html('<span>hello world</span>')
  获取：$('dov').html()

  text():
  设置：$('div').text('hello world')
  获取：$('div').text()

  // 区别：html方法会识别html标签，text方法会将内容直接当字符串，并不会识别html标签（设置若有html标签内容时使用html()方法，否则两者都可以）

3.width()方法和height()方法

  设置：$('div').width(400)
  
  获取：$('div').width() //只能获取div的width值
        $('div').innerWidth() // width+padding
        $('div').outerWidth() //width+padding+border
        $('div').outerWidth(true) // width+padding+border+margin     

  // 获取页面可视区的宽度和高度
  $(window).resize(function(){
    $(window).width()
    $(window).height()
  })

4.scrollTop()和scrollLetf()方法

  设置或获取垂直滚动条的位置

  // 获取页面被卷曲的高度和宽度
  $(window).scrollTop()
  $(window).scrollLeft()

5.offset()方法和position()方法

  offset 方法获取元素距离document的位置，position方法获取元素距离有定位的父元素的位置

  // 获取元素距离document的位置，返回值为对象 {left:100,top:100}
  $(selector).offset()

  // 获取相对于其最近的有定位的父元素的位置
  $(selector).position()

前端进阶精选：点此去