jQuery核心函數

<!--

1. 作為一般函數調用: $(param)

1). 參數為函數 : 當DOM加載完成後，執行此回調函數

2). 參數為選擇器字元串: 查找所有比對的标簽, 并将它們封裝成jQuery對象

3). 參數為DOM對象: 将dom對象封裝成jQuery對象

4). 參數為html标簽字元串 (用得少): 建立标簽對象并封裝成jQuery對象

2. 作為對象使用: $.xxx() 可以叫做工具方法

1). $.each() : 隐式周遊數組

2). $.trim() : 去除兩端的空格

-->

<script type="text/javascript" src="../../js/jquery-1.10.1.js"></script>
<script type="text/javascript">
  /*
   需求1. 點選按鈕: 顯示按鈕的文本, 顯示一個新的輸入框
   需求2. 周遊輸出數組中所有元素值
   需求3. 去掉"  my atguigu  "兩端的空格
   */
  $(function(){//綁定文檔加載完成的監聽
      $("#btn").click(function(){
          alert($(this).html())
          $('<input type="text" name="msg3"/><br/>').appendTo("div");
      });
      var arr = [2,4,8];
      $.each(arr, function(index,value) {
          console.log("index="+index+", value="+value);
          
      });
      var str = " rainbow cai";
      
      console.log($.trim(str))
      
  })
  
  
    /*需求1. 點選按鈕: 顯示按鈕的文本, 顯示一個新的輸入框*/
  //1.1). 參數為函數 : 當DOM加載完成後，執行此回調函數
  $(function () { // 綁定文檔加載完成的監聽
    // 1.2). 參數為選擇器字元串: 查找所有比對的标簽, 并将它們封裝成jQuery對象
    $('#btn').click(function () { // 綁定點選事件監聽
      // this是什麼? 發生事件的dom元素(<button>)
      // alert(this.innerHTML)
      // 1.3). 參數為DOM對象: 将dom對象封裝成jQuery對象
      alert($(this).html())
      // 1.4). 參數為html标簽字元串 (用得少): 建立标簽對象并封裝成jQuery對象
      $('<input type="text" name="msg3"/><br/>').appendTo('div')
    })
  })

  /*需求2. 周遊輸出數組中所有元素值*/
  var arr = [2, 4, 7]
  // 1). $.each() : 隐式周遊數組
  $.each(arr, function (index, item) {
    console.log(index, item)
  })
  // 2). $.trim() : 去除兩端的空格
  var str = ' my atguigu  '
  // console.log('---'+str.trim()+'---')
  console.log('---'+$.trim(str)+'---')
</script>
</body>

</html>