一、dom对象与jquery对象
- dom对象，使用js的语法创建的对象叫做dom对象，也就是js对象
var myDiv = document.getElementById("myDiv")
- jquery对象，使用jquery语法表示的对象叫做jquery对象，注意：jquery对象都是数组
var myBtn = $("#myBtn") myBtn就是一个jquery语法表示的对象，现在数组中就一个值
- dom对象与jquery对象可以相互转换
- dom对象转jquery对象，$(dom对象)
- jquery对象可以转dom对象，从jquery对象数组中获取第一个对象，第一个对象就是dom对象，[0]或者get(0)
- 为什么进行转换：目的是要使用对象的方法，或者属性
- 当你是dom对象时，可以使用dom对象的属性和方法，但如果想要使用jquery提供的函数，必须是jquery对象才可以
二、dom对象与jquery对象相互转换
1、dom对象转换为jquery对象
使用$(dom对象)方式转换，一般在命名jquery对象时，可以用$开头，这不是必须的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>dom对象转换为jquery对象</title>
<script src="jquery-3.7.0.js"></script>
</head>
<body>
<script>
function btnClick(){
var obj = document.getElementById("btn");
// 使用dom的value属性获取值
console.log(obj.value)
// dom转换为jquery
var $obj = $(obj)
console.log($obj)
console.log($obj.val())
}
</script>
<input type="button" id="btn" value="按钮" onclick="btnClick()">
</body>
</html>2、jquery对象转换为dom对象
jquery对象本身为数组对象，该数组中的第0个对象即为该jquery对象对应的dom对象
使用get(0)与下标[0]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jquery对象转dom对象</title>
<script src="jquery-3.7.0.js"></script>
</head>
<body>
<script>
function btnClick(){
// jquery获取页面元素
// 从jquery对象数组中获取下标为0的dom对象
var obj = $("#txt")[0]
// var obj = $("#txt").get(0)
var num = obj.value
obj.value = num * num
console.log(num)
}
</script>
<div>
<input type="button" value="计算平方" onclick="btnClick()">
<br>
<input type="text" name="" id="txt" value="整数">
</div>
</body>
</html>标签：jQuery,jquery,obj,dom,--,DOM,对象,var,转换 From： https://www.cnblogs.com/hyy-0/p/17601403.html