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代码: 

World!

 
$("p").append("Hello!");  //

World!Hello!

 

$("p").prepend("Hello!"); //输出:

Hello!World!

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

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


你可能感兴趣的:(jquery和ajax的区别)