Jquery入门级常用（1）——语法入门和对象与DOM 节点探讨（自我记录，有错会更新）
首行膜拜Jquery教程：http://jquery.cuishifeng.cn/index.html
摘要：
引用外网Jquery文件：
调试自己写的Demo：
HTML写JS代码：
Jquery对象和DOM节点：
各自是什么；转化方法；
浏览器工具中console.log打印出来的是什么：
我想用随笔记录下关于Jquery的学习和使用过程中常用内容。这里面内容可能由于知识有限会出现错误，可以随时留言，我看到会及时更新，改正。
- 引用外网Jquery文件：
<script src= "http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js
http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js
http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js
http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js
- 调试自己写的Demo：
有时候自己遇到问题会拆解成抽象的模型进行研究，设置一个小的样例进行细调，通常做法是自己写个页面然后调试，其实那样太麻烦了。我都是用w3c school 的DIY那那个测试页面进行调试，我遇到问题，先找到大概会是哪个地方有问题，然后找到那部分的教程，里面肯定有一个《试一试》，然后用那个进行调试。一个空页面貌似是这个：
http://www.w3school.com.cn/tiy/t.asp
- HTML写JS代码：
<script type="text/javascript">
//写上你的JS代码
</script>
- Jquery对象和DOM节点：
jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象。jQuery 对象是 jQuery 独有的，其可以使用 jQuery 里的方法，但是不能使用 DOM 的方法；例如： $("#img").attr("src","test.jpg"); 这里的 $("#img")就是 jQuery 对象。
DOM对象就是Javascript 固有的一些对象操作。DOM 对象能使用Javascript 固有的方法，但是不能使用 jQuery 里的方法。例如：document.getElementById("img").src = “test.jpg"；这里的document.getElementById("img") 就是DOM 对象。一般如果你用Jquery方法，然后报错说调用不到方法，保证方法名没写错的话，那么此时对象就是DOM的对象。转换下就行了
$("#img").attr("src","test.jpg"); 和 document.getElementById("img").src = "test.jpg"; 是等价的，是正确的，但是 $("#img").src = "test.jpg" ；或者 document.getElementById("img").attr("src","test.jpg"); 都是错误的。
再说一个例子，就是this, 在写 jQuery 时经常这样写： this.attr("src","test.jpg")；可是就是出错，其实this 是DOM对象，而.attr("src","test.jpg") 是 jQuery 方法，所以出错了。要解决这个问题就要将 DOM对象转换成 jQuery 对象，例如 $(this).attr("src","test.jpg");
所以，this是什么，this是DOM对象，var是什么，var是变量，是个容器。
1. DOM 对象转成 jQuery 对象
对于已经是一个 DOM 对象，只需要用 $() 把DOM对象包装起来，就可以获得一个 jQuery 对象了，$(DOM 对象) 注： var是定义变量
如：
var v = document.getElementById("v"); //DOM对象 var $v = $(v); //jQuery 对象
转换后，就可以任意使用 jQuery 的方法。
2. jQuery 对象转成 DOM 对象
两种转换方式讲一个 jQuery 对象转换成 DOM 对象： [index] 和 .get(index)；
(1) jQuery 对象是一个数据对象，可以通过 [index] 的方法，来得到相应的 DOM 对象。
如：
var $v = $("#v"); //jQuery 对象 var v = $v[0]; //DOM 对象 alert(v.checked); //检测这个checkbox是否被选中
(2) jQuery 本身提供，通过.get(index) 方法得到相应的 DOM 对象
如：
var $v = $("#v"); //jQuery 对象 var v = $v.get(0); //DOM对象 ( $v.get()[0] 也可以 ) alert(v.checked); //检测这个 checkbox 是否被选中
通过以上方法，可以任意的相互转换 jQuery 对象和 DOM 对象，需要再强调的是： DOM 对象才能使用DOM 中的方法，jQuery 对象是不可以使用DOM中的方法。
- 浏览器工具中console.log打印出来的是什么：
所以看到上面的0了吧，应该就是js中表示自己的那个内容，来看下面的，谷歌浏览器的工具，用console.log()打印出来Jquery对象。
上面这个是用了：
var v = $('#v'); console.log(v);
这个 0 里面包含的内容是JS原生的DOM对象的属性，具体各属性参见：HTML DOM Element 对象。
然后我们看看DOM对象打印出来是什么：用代码
var v = $('#val'); var va = v.get(0); // alert(va.val()) console.log(va);
这个就是DOM对象了，可以直接看到整个标签。可以使用JS原生的一些方法；
相关文章：Jquery入门级常用——Jquery常用方法和JS常用方法
