1. 程式人生 > >前端---JQuery初識

前端---JQuery初識

---恢復內容開始---

 

  • BOM
  • JQuery認識
  • JQuery基本選擇器
  • JQuery高階選擇器

1.javascript基礎部分包括三個部分:

  ECMAScript:JavaScript的語法標準。包括變數、表示式、運算子、函式、if語句、for語句等。

  DOM:文件物件模型,操作網頁上的元素的API。比如讓盒子移動、變色、輪播圖等。

  BOM:瀏覽器物件模型,操作瀏覽器部分功能的API。比如讓瀏覽器自動滾動。

  DOM是BOM的一部分。

window物件:

  window物件是javascript中的頂級物件

  全域性變數、自定義函式也是window物件的屬性和方法

BOM常見的內建方法和內建物件:

  (1) window.open(url,target)

  引數解釋: url :要開啟的地址

      target:新視窗的位置.可以是_biank,_self,_parent父框架

<script>
setTimeout(function () {
window.open('www.baidu.com','_self') //_self 表示在當前頁面開啟,不寫會跳轉一個新頁面
},2000)
</script>
 (2)location 物件屬性
  window.location 可以簡寫成location.他相當於瀏覽器位址列,可以將url解析成獨立片段
    // location.host; //主機名,包括埠
    // location.pathname; // 主機名
    // location.protocol ;// 協議 一般是http https
    // location.search ;//查詢內容(字串) ?號之後的一般是查詢的內容
    // location.href;// 跳轉(網址)

   location.href 的屬性:

    

 var div = document.getElementsByTagName("div")[0];

div.onclick = function () {
location.href = "http://www.baidu.com"; //點選div時,跳轉到指定連結 (點選會跳轉到百度)

// window.open("http://www.baidu.com","_blank"); //方式二

  (3)history物件

    history.go(0) //全部重新整理 (不好)

    history.go(-1)// 後退一步回到原來的位置     

2 JQUERY 初識:

  再用js寫程式碼時,會遇到一些問題:

    window.onload 事件有事件覆蓋的問題,因此只能寫一個事件。

    程式碼容錯性差。

    瀏覽器相容性問題。

    書寫很繁瑣,程式碼量多。

    程式碼很亂,各個頁面到處都是。

    動畫效果很難實現。

  (1)什麼是Jquery?

    jQuery 是 js 的一個庫,封裝了我們開發過程中常用的一些功能,方便我們呼叫,提高開發效率。

  js庫是把我們常用的功能放到一個單獨的檔案中,我們用的時候,直接引用到頁面裡即可。 jquery只是封裝文件遍歷和操作,事件處理,動畫和Ajax

   關於jQuery的相關資料:

          官網:http://jquery.com/

          官網API文件:http://api.jquery.com/

          漢化API文件:http://www.css88.com/jqapi-1.9/

  (2)JQUERy的下載:

    https://www.bootcdn.cn/jquery/

  (3)引入方式: