jQuery核心函数
jQuery()或$()函数是jQuery库中的核心函数,jQuery的一切都是基于此函数的。该函数主要用于获取HTML DOM元素并将其封装为jQuery对象,以便于使用jQuery对象提供的其他属性和方法对DOM元素进行操作。以下为可以接收的参数类型:
-
可以接收一个核心函数
$(function(){ // 本文档页面载入完成后自动执行 alert("文档加载完毕!"); });//jQuery的入口函数
-
可以接收一个字符串
-
可以接收一个字符串选择器
var $box1 = $(".box1") var $box2 = $("#box2") console.log($box1, $box2) //返回一个jQuery对象,对象中保存了找到的DOM元素
-
可以接收一个字符串代码片段
var $p = $("<p>我是p</p>") //如果传入字符串代码片段,那么会根据字符串代码创建对应的元素 //返回一个jQuery对象,对象中保存了创建的DOM元素
-
-
接收一个DOM元素
var span = document.getElementsByTagName("span")[0] var $span = $(span) //如果将元素的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>jQuery核心函数</title>
</head>
<script src="../jquery-3.5.1.js"></script>
<body>
<div class="box1"></div>
<div id="box2"></div>
<span>我是span</span>
</body>
<script>
$(); //调用jQuery的核心函数
//1.可以接收一个核心函数
$(function () {
alert("hello")
//2.可以接收一个字符串
//2.1可以接收一个字符串选择器
var $box1 = $(".box1")
var $box2 = $("#box2")
console.log($box1, $box2)
//返回一个jQuery对象,对象中保存了找到的DOM元素
//2.2可以接收一个字符串代码片段
var $p = $("<p>我是p</p>")
//如果传入字符串代码片段,那么会根据字符串代码创建对应的元素
//返回一个jQuery对象,对象中保存了创建的DOM元素
//3.接收一个DOM元素
var span = document.getElementsByTagName("span")[0]
var $span = $(span)
//如果将元素的DOM元素传入到jQuery的核心函数中,那么会把DOM元素包装成一个jQuery对象
})
</script>
</html>
jQuery对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery对象</title>
<script src="../jquery-3.5.1.js"></script>
</head>
<body>
<div>div1</div>
<div>div2</div>