Day01JQuery介紹及使用

jQuery(Javascript框架)

對javascript代碼的封裝，javascript功能代碼的半成品

jQuery作用

1）.簡化javascript開發，提高開發效率
2）.屏蔽瀏覽器差異

所需插件

1） jQuery ——-js——-jquery-1.xx.x.js
eg：jquery-1.8.3.js jquery-1.8.3.min.js
2）.jquery和jquery.min區別
jquery.min文件是經過jquery壓縮，便於網絡傳輸

使用jQuery

1.通過script標籤引用外部js文件

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

2.在另外一個script標籤中使用jquery函數

jquery標籤支持鏈式調用
1）$(‘#id’)根據id獲得響應標籤對象
2）jq.text 獲取標籤體內部的文本
3）通過jq.css()方法爲當前標籤增加樣式

<script type="text/javascript">
    //通過id獲得對應的jquery對象（id選擇器）
    var jqdiv = $('#d1');
    //加上.get(0)則轉化爲dom對象
    var jqdiv = $('#d1').get(0);
    //通過js獲得dom對象
    var domdiv = document.getElementById('d1');

    //獲取標籤體內部的文本 
    jq.text()   //獲取標籤內部的文字,相當於dom對象.innerHTML
    $('#id').text();

    //爲當前標籤增加樣式
    jq.css('css屬性名','css屬性值');
    //通過css()方法添加樣式,鏈式增加樣式，後面還可以繼續跟.css()來繼續增加樣式
    //css方法最後一行代碼  return  jq;
</script>    

3.通過js代碼獲得dom對象和jquery獲得jq對象

dom對象.js屬性或方法

jq對象.jq屬性或者方法

1）document.getElementById(id)—>dom對象 不可以調用jquery相關方法
2）$(‘#id’)—>只有jquery對象，纔可以調用jquery相關方法text(),css()

如何獲取一個jquery對象：
1）通過jq選擇器獲得一個jquery對象

2）通過dom對象獲得jquery對象 $(dom對象)

3）通過$(‘標籤文本’)，創建新的jq對象

 eg:比如創建td的標籤對象$('<td></td>')