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>')