原生js和jQuery主要异同点

1、入口函数的不同

js：window.onload = function(){内部放js}　　　
　　jQuery:$(function())或者$(document).ready(function(){})

2、获取元素的方式不同

js：常用的以下几个，除了id，其他的结果都是伪数组

document.getElementsByTagName("a")
document.getElementById("demo")
document.getElementsByClassName("class")　　有兼容性问题
document.getElementsByTagName("*")　　获得所有的标签，用来遍历

html5新增选择器
　　document.querySelector(selector) 可以通过CSS选择器的语法找到DOM元素，返回
　　　　第一个满足选择器条件的元素 一个dom对象
　　document.querySelectorAll('.item');返回所有满足该条件的元素 一个元素类型是dom类
　　　　型的数组

jQuery：

$(" ")通过和css雷同的选择器方式来获取元素。得到的是jquery对象（dom元素的数组，外加其他一些成员）。即使写的是id，唯一的，得到的对象都不是单一的。

本质上jquery方式和qs方式都是获取DOM数组， 只不过jquery会多一些其他成员，
DOM数组的每一个成员注册事件不能像jquery一样直接注册， 必须分别给每个元素注册

3、DOM对象和jquery对象的相互转换

jQuery对象转换成DOM对象:

方式一：$(“#btn”)[0]

方式二：$(“#btn”).get(0)得到dom对象。

eq（0）得到jquery对象

DOM对象转换成jQuery对象：

$(document) -> 把DOM对象转成了jQuery对象

var btn = document.getElementById(“btn”);

btn -> $(btn);$(this)

Jquery得到的元素类型都是对象，内容是伪数组，无论是不是唯一的元素。

4、事件处理程序不同

js：
　　document.getElementById(“id”).onclick = function(){　// 语句　}
　　document.getElementById(“id”).addEventListener(“click”,function(){})
　　
　　onclick，onfoucs，onblur，fouce（自动获得），select（自动选择文本域内容），onmouseover，onmouseout，oninput/onpropertychange用户输入事件，onchange(下拉菜单select内容发生改变时发生事件，如果内容为几，那么做出什么反应)

jquery
　　$(“#id”).click(function(){ 　　　　// 语句 　　});

最后

以上就是清秀诺言为你收集整理的原生js和jQuery主要异同点的全部内容，希望文章能够帮你解决原生js和jQuery主要异同点所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。