jQuery 对象与 Dom 对象转化
首先,我们需要知道,为什么我们需要转化两者,原因在于,两者提供的方法不能共用。
比如:
$("#id").innerHTML;
document.getElementById(id).html();
以上代码都是错误的,
第一行,$("#id") 是jQuery 对象,而innerHTML是Dom对象的方法;
第二行,document.getElementById(id) 是Dom对象,而html() 是jQuery对象的方法;
正如我们开始说的,两者提供的方法,不能为非本对象所用,即jQuery对象无法使用Dom对象提供的方法,Dom对象也无法使用jQuery对象提供的方法 。
但有时,我们需要使用本对象中没有提供的方法,此时,需要转化两者。
风格约定:我们约定好,jQuery对象变量名前加上$符号。
let $str = $(".txt") // jQuery 对象
let str = $str.get(0); // Dom 对象
1.jQuery 对象转化为 Dom 对象
(1) jQuery 对象是一个数组对象,所以,我们可以使用[index]将其转化为Dom对象:
let $str = $(".txt") // jQuery 对象
let str = $(".txt")[0]; // Dom 对象
(2) jQuery对象本身也提供了一种方法来转化为Dom对象,get(index):
let $str = $(".txt") // jQuery 对象
let str = $str.get(0); // Dom 对象
2.Dom对象转化为jQuery对象:
Dom 对象转化为jQuery对象,只需用$()把Dom对象包裹起来,就可以获得jQuery对象
let str = document.getElementById(id); // Dom 对象
let $str = $(str); // jQuery 对象
我们可以通过console.log() 打印出两者
这样,我们就能直观的检测到,当前对象具体是Dom对象,还是jQuery对象。
(完)
jQuery 对象与 Dom 对象转化的更多相关文章
- jQuery对象和DOM对象和字符串之间的转化
jQuery对象和DOM对象和字符串之间的转化 字符串---------->jQuery对象 $(HTML字符串): $('<div>我是祖国的一朵小花</div>') ...
- jQuery对象与DOM对象及互相转化
<p id=‘’hello”></p> 普通处理,通过标准JavaScript处理: var p = document.getElementById('hello'); p.i ...
- JQuery学习笔记---jquery对象和DOM对象的关系
1.DOM(Document Object Model,文档对象模型).DOM树 { html (head&&body), head(meta && title) ...
- jQuery对象和DOM对象的互相转换【 转】
jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...
- 关于jQuery对象与DOM对象
今天遇到了关于jQuery对象与dom对象的区分问题.具体如下:对于元素<span id="aa" class="aa">hyz</span& ...
- JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)
一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...
- 【Jquery系列】详解Jquery对象和Dom对象
问题描述 本篇文章主要讲解Jquery对象和DOM对象,主要围绕如下五个方面来介绍: Jquery对象和dom对象定义 Jquery对象与dom对象区别 Jquery对象及运用举例 dom对象及运用举 ...
- jQuery对象转换为DOM对象(转)
jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...
- jQuery对象与DOM对象的相互转化
jQuery是一个类数组对象,DOM对象就是一个单独的DOM元素,他们都是可以操作的DOM元素. 一.jQuery对象转化为DOM对象 有以下两种方法: 方法一:利用数组下标的方式读取jQuery中的 ...
随机推荐
- WebX.0:Web1.0
ylbtech-WebX.0:Web1.0 web1.0时代是一个群雄并起,逐鹿网络的时代,虽然各个网站采用的手段和方法不同,但第一代互联网有诸多共同的特征,表现在技术创新主导模式.基于点击流量的盈利 ...
- Oracle10gr2 开机自启动脚本
目录 目录 软件环境 Oracle服务启动停止重启脚本 软件环境 操作系统 RHEL6.1 软件 Oracle10gr2 Oracle服务启动.停止.重启脚本 su - oracle cd /u01/ ...
- table td 溢出隐藏
需要给table加一个属性:table-layout:fixed;
- LeetCode题:旋转链表
原题: 给定一个链表,旋转链表,将链表每个节点向右移动 k 个位置,其中 k 是非负数. 示例 1: 输入: 1->2->3->4->5->NULL, k = 2输出: ...
- CF322F
CF322F 拉格朗日插值 #include<iostream> #include<cstdio> #include<algorithm> #include< ...
- CF1168C
CF1168C 从后往前扫一遍维护\(f[x][k]\)表示从开始x至少要走到那个位置才能到达一个第\(k\)位是1的数 #include<iostream> #include<cs ...
- Java技术专区-虚拟机系列-虚拟机参数(常用)
基础参数系类(内存分配) -server:一定要作为第一个参数,在多个CPU时性能佳 -Xmn:young generation的heap大小,一般设置为Xmx的3.4分之一-Xms:初始Heap大小 ...
- arcpy-字段唯一值、重复值、最值、平均值、方差、标准差、中数、众数
插个广告,制作ArcGIS的Tool工具学习下面的教程就对了: 零基础学习Python制作ArcGIS自定义工具观看链接 <零基础学习Python制作ArcGIS自定义工具>课程简介 im ...
- python之命名元组的好处
collections.namedtuple() 命名元组的一个主要用途是将你的代码从下标操作中解脱出来举例使用 # 使用 from collections import namedtuple Sub ...
- Redis事务 和 pipleline
1.reidis事务 Redis 事务可以一次执行多个命令, 并且带有以下三个重要的保证: 批量操作在发送 EXEC 命令前被放入队列缓存. 收到 EXEC 命令后进入事务执行,事务中任意命令执行失败 ...