专业编程基础技术教程

网站首页 > 基础教程 正文

Java开发如何配置JQuery核心函数?

ccvgpt 2024-11-25 10:08:56 基础教程 1 ℃


1. 什么是JQuery的核心函数

Java开发如何配置JQuery核心函数?

$();/jQuery();就代表调用jQuery的核心函数

调用JQuery和核心函数可以传入以下三种类型的参数

1.1 传入一个函数类型的参数

传入一个函数类型的参数就是我们jQuery的入口函数

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>06-jQuery核心函数</title>
<script src="js/jquery-1.12.4.js">
</script>   
 <script>
        // 1.接收一个函数
        $(function () {
            alert("hello xyr");
        });
    </script>
</head>
<body>
<div class="box1"></div>
<div id="box2"></div>
<span>我是span</span>
</body>
</html>

1.2 传入一个字符串类型的参数

字符串类型可以传入一个字符串选择器,返回一个jQuery对象, 对象中保存了找到的DOM元素。

$(function () {   
 alert("hello lnj");
// 接收一个字符串选择器
    // 
    var $box1 = $(".box1");
    var $box2 = $("#box2");
    console.log($box1);
    console.log($box2);});

字符串类型也可以传入一个字符串代码片段,返回的也是一个jQuery对象,对象保存的是创建的DOM元素。

// 接收一个函数类型的参数
$(function() {   
 // 接收一个字符串的代码片段    
var $p = $("<p>我是p标签</p>");    
console.log($p);    
$box1.append($p);});

1.3. 传入一个DOM元素

传入一个DOM元素,会被包装成一个jQuery对象返回给使用者。

// 接收一个DOM元素
// 会被包装成一个jQuery对象返回给我们
var span = document.getElementsByTagName("span")[0];
console.log(span);
var $span = $(span);
console.log($span);

2. 什么是JQuery对象

刚才我们通过调用jQuery核心函数,并且传入对应的字符串选择器,字符串代码片段等等,结果会给我们返回一个JQuery对象,那么什么是jQuery对象呢?

var $div = $("div");
console.log($div);
var arr = [1, 3, 5];
console.log(arr);

运行结果如下所示:

通过观察我们可以发现:JQuery本质就是一个伪数组,那么什么是伪数组?伪数组就是有0到length-1的属性, 并且有length属性。

知道了JQuery对象的本质之后,我们可以通过JQuery对象转换成DOM对象。

var a = $(".div1")[0];
console.log(a);

最近发表
标签列表