JQuery的初学笔记——和原生JS的区别

最近摸索着学习JavaScript，从W3School上学习了原生的JS，后来又开始学习JQuery，觉得先入为主的思想在我身上体现的太强烈了，总是在用JQuery的时候敲成原生的写法，可能还是对JQuery不熟悉吧，为了改正，把自己容易记混的代码记录下来，警示自己。

一、刚入手时最觉得JQuery方便的地方

JS：返回元素

<span style="font-size:14px;">document.getElementById("id");//通过iddocument.getElementsByTagName("a");//通过标签的名称document.getElementsByName("name");//通过名字document.getElementsByClassName("cName");//通过类名</span></span>

JQuery：返回JS对象

<span style="font-size:14px;">$("#id")//通过id$(".cName") 通过class$("div") 通过标签</span></span>

二、我最初最容易敲错，顺手就把原生的敲到jQ里了，然后出问题了才恍然发现，自己就是欠抽

JS：不写="这是内容" 是返回text的内容，写了是赋值

<span style="font-size:14px;">document.getElementById("id").innerHTML="这是内容";</span>

JQuery：用法同上

<span style="font-size:14px;">$(#id).html("这是内容");</span>

三、学习了几天后终于不再纠结语法问题了，来到了事件

JS：

window.onload=function(){//编写代码}

这个方法是在网页中所有的元素(包括元素的所有关联文件)完全加载到浏览器后才执行，即javaScript此时才可以访问网页中的任何元素。如果网页图片比较多的话，又要对图片进行操作，用户必须等到每一幅图片都加载完毕后才可以操作。还有重要的一点onload事件一次只能保存对一个函数的引用，如果把上面的代码编写两边，后面的函数会覆盖前面的函数

JQuery：

$(document).ready()

这个方法在DOM完全就绪时就可以被调用，可以访问网页的所有元素，但是并不意味着与元素关联的文件都已经下载完毕。如果网页图片比较多的话，只要DOM加载完就可以操作，不必等图片下载完毕。而且可以保存多个函数的引用，然后根据函数顺序执行。但是如果在这个方法中获取图片的宽高有可能不准确，那就用到了另一个方法

$(window).load(function(){//编写代码});<pre name="code" class="javascript">简写方式$(function(){//编写代码});

load()方法会在元素的onload事件中绑定一个处理函数，如果处理函数绑定给window对象，则会在所有内容(包括窗口、框架、对象和图像等)加载完毕后触发，如果绑定在元素上，则会在元素的内容加载完毕后触发。