jQuery对象

Posted 2020-12-25 caicaihong

1. jQuery对象是一个包含所有匹配的任意多个dom元素的伪数组对象
2. 基本行为
* size()/length: 包含的DOM元素个数
* [index]/get(index): 得到对应位置的DOM元素
* each(): 遍历包含的所有DOM元素
* index(): 得到在所在兄弟元素中的下标

<script src="../../js/jquery-1.10.1.js" type="text/javascript"></script>
<script type="text/javascript">

  /*
   需求:
   需求1. 统计一共有多少个按钮
   需求2. 取出第2个button的文本
   需求3. 输出所有button标签的文本
   需求4. 输出‘测试三‘按钮是所有按钮中的第几个
   */
  var $buttons = $("button");
  console.log($buttons.length);
  console.log($buttons.size())
  //取出的元素是dom元素之后就可以具有dom的操作
  console.log($buttons[1].innerhtml)
  var html = $buttons.get(1).innerHTML;
  console.log(html)
  
  $buttons.each(function(){
      console.log(this.innerHTML)
  });
  
  console.log($buttons.index($("#btn3")));
  

自定义一个伪数组：

什么叫伪数组

/*
* 特点：
* object对象
* 有length属性
* 可以通过index访问
* 但是没有数组的特有的方法，pop push等
*/

  // 自定义一个伪数组
  var weiArr = {}
  weiArr.length = 0
  weiArr[0] = ‘rainbow‘
  weiArr.length = 1
  weiArr[1] = 123
  weiArr.length = 2
  for (var i = 0; i < weiArr.length; i++) {
    var obj = weiArr[i]
    console.log(i, obj)
  }
  console.log(weiArr.forEach, $buttons.forEach) //undefined, undefined