jQuery库本质上还是JavaScript代码，它只是对JavaScript语言进行包装处理，为的是提供更好更方便快捷的DOM处理与开发中经常使用的功能。
我们使用jQuery的同时也能混合JavaScript原生代码一起使用。
在很多场景中，我们需要jQuery与DOM能够相互的转换，它们都是可以操作的DOM元素，
jQuery是一个类数组对象，而DOM对象就是一个单独的DOM元素。
如何把jQuery对象转成DOM对象？
利用数组下标的方式读取到jQuery中的DOM对象
用jQuery找到所有的div元素（3个），因为jQuery对象也是一个数组结构，可以通过数组下标索引找到第一个div元素，
通过返回的div对象，调用它的style属性修改第一个div元素的颜色。
这里需要注意的一点是，数组的索引是从0开始的，也就是第一个元素下标是0.
<!DOCTYPE html>
<html>
<head>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title></title>
<script src="http://code.jquery.com/jquery-1.11.3.js"></script>
</head>
<body>
<div>元素一</div> //运行后
<div>元素二</div> //运行后
<div>元素三</div>
<script type="text/javascript"> //第一种方法
var $div = $(‘div‘); //jQuery对象
var div=$div[0]; //转化成DOM对象
div.style.color = ‘red‘; //操作dom对象的属性
</script>
<script type="text/javascript"> //第二种JQ对象转化成DOM对象的方法
var $div=$("div"); //jQuery对象
var div=$div.get(1); //通过get方法，转化成DOM
div.style.color="blue"; //操作dom对象的属性
</script>
</body>
</html>
小结：
<script>
var $div=$("div"); //jQuery对象
$div.get(0).style.color="red";或$div[0].style.color="red ; //也可以这样直接操作dom对象的属性，省去上面中间“转化成DOM对象”的第二步
</script>
原文地址：https://www.cnblogs.com/youxiaowj/p/8476859.html