jquery和ajax的区别

jquery和ajax的区别

jquery 就对javascript的一个扩展，封装，就是让javascript更好用，更简单。

1、加载DOM区别 

JavaScript：
//只会执行第二个window.onload；不过可以通过以下方法来进行改进： 

window.οnlοad=function(){

   ...

   ...

}
Jquery： 
$(document).ready() 
//均会执行 


2、获取ID 

JavaScript： 
document.getElementById("idName") 

JQuery： 
$("#idName") 

3、获取Class 

JavaScript： 
JavaScript没有默认的获取class的方法 

JQuery： 
$(".className") 

4、获取TagName 

JavaScript： 
document.getElementsByTagName("name") 

JQuery： 
$("name") 

5、创建对象并加入文档中 

JavaScript： 
var param = document.createElement("p"); //创建一个p元素 

//将p元素追加为body的lastchild子节点，如果想将新创建的p元素插入到已存在的某个元素之前，可以使用insertBefore()方法 document.body.appendElement(para); 

JQuery：
JQuery提供了4种将新元素插入到已有元素（内部）之前或者之后的方法：append() / appendTo()、prepend() / prependTo()。 
格式：$("").append(""); 
eg:html代码： 
<p>World!</p> 
$("p").append("<b>Hello!</b>");  //<p>World!<b>Hello!</b></p> 

$("p").prepend("<b>Hello!</b>"); //输出：<p><b>Hello!</b>World! </p> 
6、插入新元素 

JavaScript： 

parentElement.insertBefore(newElement,targetElement) 
eg, 将一个img元素插入一个段落之前。 

JQuery： 
JQuery提供了4种将新元素插入到已有元素（外部）之前或者之后的方法：after()、insertAfter()、before()、insertBefore()。 
格式：$("").after(); 


7、复制节点 

JavaScript： 
reference = node.cloneNode(deep) 
这个方法只有一个布尔型的参数，它的可取值只能是true或者false。该参数决定是否把被复制节点的子节点也一同复制到新建节点里去。 

JQuery： 
clone() //复制节点后，被复制的新元素并不具有任何行为 
clone(true) //复制节点内容及其绑定的事件 
备注：该方法通常与appendTo()、prependTo()等方法结合使用。 

8、删除节点 

JavaScript： 
reference = element.removeChild(node) 
//删除一个子节点 

JQuery： 
remove(); //方法作用就是从DOM中删除所有匹配的元素
empty(); //方法作用是清空节点。 

9、属性操作：设置属性节点、查找属性节点 

JavaScript： 
document.getElementsByTagName('tagName') 

JQuery： 
JQuery中设置和查找属性节点都是：attr() 。 
$('p').attr('title'); //获取 
$('p').attr('title','My title'); //设置 ,当需要添加多个属性时，中间用逗号隔开。 

10、替换节点 

JavaScript： 
reference = element.replaceChild(newChild,oldChild) 
该方法是将一个给定父元素里的一个子节点替换为另外一个节点。 

JQuery： 
replaceWith()、replaceAll() 

等等，这里只是其中的一部分不同。