JQuery学习之路Part3：JQuery与DOM的转换、事件的分类

迈不过友情╰ 2023-07-12 06:29 22阅读 0赞

# JQuery与DOM的转换 #

Jquery和DOM并不一样  
**Jquery的方法DOM不能用 DOM的方法JQuery不能用**

**可将JQuery对象转化为DOM对象：**

var $btn=$("#btn");
    或
    var $li=$("li");
    $li[0]
    $li.get(0)
    $li.setAttribute()

这样即可调用DOM的方法了

**还可将DOM对象转化为JQuery对象：**

var a=document.getElementById()
    $(a).text()

这样即可调用JQuery的方法了

--------------------

# 事件 #

**1**、当按钮的**点击事件**被触发时会调用一个函数

$("button").click(function() {
        ..some code... } )

**2**、**就绪事件**（当文档完成加载时）

$(document).ready(function)
    	$(document.ready(function(){
        
           alert("我被加载了");
    }))

相等于

$(function(){
        
           alert("我被加载了");
    })

**3**、**点击事件**

$(selector).click(function)

**4**、**双击事件**

$(selector).dblclick(function)

**5**、**获得焦点事件**

$(selector).focus(function)

**6**、**鼠标悬停事件**

$(selector).mouseover(function)

例子：当button案例被按下 p标签隐藏

$(document).ready(function(){
        
      $("button").click(function(){
        
        $("p").hide();
      });
    });

--------------------

发表评论取消回复

表情：

评论列表（有 0 条评论，22人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery成功之路——jQuery的DOM操作简单易懂

jQuery的DOM操作 1.jQuery操作内容 jQuery操作内容 1. text() 获取或修改文本内容类似于 dom.innerText 2. html

偏执的太偏执、/ 2024年03月10日 04:40/ 0 赞/ 133 阅读

相关 JQuery学习之路Part5：DOM元素内容和属性值的获取和设置

一、获取/设置内容 1、text() 获取所选元素的文本内容获取双标签文本内容不往方法里传入参数即为获取例： $("btn1").cli

逃离我推掉我的手/ 2023年07月12日 09:27/ 0 赞/ 88 阅读

相关 JQuery学习之路Part3：JQuery与DOM的转换、事件的分类

JQuery与DOM的转换 Jquery和DOM并不一样 Jquery的方法DOM不能用 DOM的方法JQuery不能用可将JQuery对象转化为DOM对象：

迈不过友情╰/ 2023年07月12日 06:29/ 0 赞/ 23 阅读

相关 JQuery学习之路Part1：JQuery的介绍及导入方式

JQuery的功能： 1、查找 2、页面加载事件 3、和DOM之间的转化例：`arr.click.dbclick.hide`可逐行操作无须再嵌套

客官°小女子只卖身不卖艺/ 2023年07月12日 06:26/ 0 赞/ 20 阅读

相关前端技术（JQuery）学习笔记（一）JQuery文档准备就绪事件、JQuery事件处理、JQuery对象与DOM对象的、JQuery取值

一、JQuery，是一套JavaScript的函数库（类库），可以很大程度上简化js代码。所以，利用Jquery对HTML元素的操作更加的便捷。 1、JQuery的核心函数：

叁歲伎倆/ 2022年05月25日 01:19/ 0 赞/ 280 阅读

相关 JQuery应用实例学习 —— 19 JQuery对象与DOM对象的关系与转换

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

忘是亡心i/ 2022年05月12日 05:18/ 0 赞/ 264 阅读

相关 jQuery中的事件与DOM操作

jQuery中的事件基础事件鼠标事件： click( )：单击鼠标时 mouseover( )：鼠标指针移过时 mouseout( )：鼠标指针移出

╰半夏微凉°/ 2022年04月18日 05:20/ 0 赞/ 373 阅读

相关 jquery学习之延迟jQuery的ready事件

网页页面dom加载完成后，我们才会处理一些业务逻辑，但是有时候我们需要在加载完成之前做一些别的任务，此时，就需要了解延迟ready的事件。 jqu

骑猪看日落/ 2022年04月08日 09:19/ 0 赞/ 311 阅读

相关 JQuery学习笔记(3)JQuery中的DOM操作

JQuery中的DOM操作引子 DOM: Document Object Model，文档对象模型，一种与浏览器、平台、语言无关的接口，使用该接口可以轻松地

墨蓝/ 2021年11月05日 12:20/ 0 赞/ 427 阅读

相关 jQuery--DOM对象与jQuery对象的转换

在JavaScript中，通过getElementById()、getElementsByClassName()和querySelector()等方法来获取要页面中的HTML元

骑猪看日落/ 2021年08月13日 22:28/ 0 赞/ 567 阅读