jQuery_03 dom对象和jQuery对象的互相转换

dom对象和jQuery对象

dom对象    jQuery对象  在一个文件中同时存在两种对象

dom对象: 通过js中的document对象获取的对象 或者创建的对象

jQuery对象: 通过jQuery中的函数获取的对象。

为什么使用dom或jQuery对象呢?

目的是 要使用dom对象的函数或者属性 以及呢 要使用jQuery中提供的函数或者属性。要使用dom中的内容 就需要使用dom对象 要使用jQuery中的函数 就需要使用jQuery对象

dom对象 和 jQuery对象 可以相互转换

dom对象转换为jQuery对象

$(dom对象) 得到一个jQuery对象 可以调用jQuery中提供的函数

<body><input type="button" id="btn" value="我是按钮" onclick="btnClick()" />
</body><script type="text/javascript">// dom对象    jQuery对象  在一个文件中同时存在两种对象// dom对象: 通过js中的document对象获取的对象 或者创建的对象// jQuery对象: 通过jQuery中的函数获取的对象。//为什么要使用 dom对象 或者说 jQuery对象呢?//目的是 要使用dom对象的函数或者属性 以及呢 要使用jQuery中提供的函数或者属性。// 要使用dom中的内容 就需要使用dom对象 要使用jQuery中的函数 就需要使用jQuery对象// dom对象 和 jQuery对象 可以相互转换/* 1.dom对象转换为jquery对象$(dom对象) 得到一个jQuery对象 可以调用jQuery中提供的函数*/// var dom = document.getElementById("t1");// //把dom 转换为jQuery// var jqueryobj = $(dom);// //调用jQuery中的函数 .......// jqueryobj.val() //获取dom对象的值// 提示: 为了区分dom对象和jQuery对象 一般情况下 jQuery对象的变量名前面都会加上$符号 例如$objfunction btnClick() {var obj = document.getElementById("btn");//转成jQuery对象var $jobj = $(obj); //$jobj就是jQuery对象alert($jobj.val()); // 获取按钮的值}</script>

jQuery对象转换为dom对象

 语法:jQuery对象是一个数组 数组成员是dom对象  使用[下标] 或者 get(下标) 获取dom对象

  <body><!-- <input type="text" id="t1" /> --><!-- <input type="text" id="txt1" /> --><input type="button" id="btn" value="计算平方" onclick="btnClick()" /><br /><input type="text" id="txt1" value="请输入整数" /></body>
 <script type="text/javascript">/* 语法:jQuery对象是一个数组 数组成员是dom对象  使用[下标] 或者 get(下标) 获取dom对象*///  $("#txt1"):获取id为txt1的对象/*     var obj = $("#txt1"); // obj是一个jQuery对象 是一个包含了一个成员的dom数组。 obj[0] 就是dom对象var dom = obj[0]; //dom对象  或者 obj.get(0) 也是dom对象// 使用dom对象的函数 或者 属性alert(dom.value); */function btnClick() {// var obj = $("#txt1"); //obj 是jquery对象var dom = obj.get(0);// var dom = obj[0];var num = dom.value;dom.value = num * num;alert(dom.value);}</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/167638.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python -opencv 轮廓检测(多边形,外接矩形,外接圆)

python -opencv 轮廓检测(多边形&#xff0c;外接矩形&#xff0c;外接圆) 边缘检测步骤: 第一步&#xff1a;读取图像为灰度图 第二步&#xff1a;进行二值化处理 第三步&#xff1a;使用cv2.findContours对二值化图像提取轮廓 第三步&#xff1a;将轮廓绘制到图中 代码如下…

Hibernate的三种状态

1.瞬时状态(Transient) 通过new创建对象后&#xff0c;对象并没有立刻持久化&#xff0c;他并未对数据库中的数据有任何的关联&#xff0c;此时java对象的状态为瞬时状态&#xff0c;Session对于瞬时状态的java对象是一无所知的&#xff0c;当对象不再被其他对象引用时&#xf…

【TL431+场效应管组成过压保护电路】2022-3-22

缘由这个稳压三极管是构成的电路是起到保护的作用吗&#xff1f;-硬件开发-CSDN问答

HTML5+ API 爬坑记录

背景: 有个比较早些使用5开发的项目, 最近两天反馈了一些问题, 解决过程在此记录; 坑1: plus.gallery.pick 选择图片没有进入回调 HTML5 API Reference 在 联想小新 平板电脑上选择相册图片进行上传时, 打开相册瞬间 应用会自动重启, 相册倒是有打开, 不过应用重启了, 导…

[原创](免改BIOS)使用Clover升级旧电脑-(高阶玩法)让固态硬盘内置Win11 PE启动系统

[简介] 常用网名: 猪头三 出生日期: 1981.XX.XXQQ: 643439947 个人网站: 80x86汇编小站 https://www.x86asm.org 编程生涯: 2001年~至今[共22年] 职业生涯: 20年 开发语言: C/C、80x86ASM、PHP、Perl、Objective-C、Object Pascal、C#、Python 开发工具: Visual Studio、Delphi…

【算法专题】滑动窗口—无重复字符的最长子串

力扣题目链接&#xff1a;无重复字符的最长子串 一、题目解析 二、算法原理 解法一&#xff1a;暴力解法&#xff08;时间复杂度最坏&#xff1a;O(N)&#xff09; 从每一个位置开始往后枚举&#xff0c;在往后寻找无重复最长子串时&#xff0c;可以利用哈希表来统计字符出现…

手机APP-MCP走蓝牙无线遥控智能安全帽~执法记录仪~拍照录像,并可做基础的配置,例如修改服务器IP以及配置WiFi等

手机APP-MCP走蓝牙无线遥控智能安全帽~执法记录仪~拍照录像,并可做基础的配置,例如修改服务器IP以及配置WiFi等 手机APP-MCP走蓝牙无线遥控智能安全帽~执法记录仪~拍照录像,并可做基础的配置,例如修改服务器IP以及配置WiFi等&#xff0c; AIoT万物智联&#xff0c;智能安全帽…

JVM之jvisualvm多合一故障处理工具

jvisualvm多合一故障处理工具 1、visualvm介绍 VisualVM是一款免费的&#xff0c;集成了多个 JDK 命令行工具的可视化工具&#xff0c;它能为您提供强大的分析能力&#xff0c;对 Java 应 用程序做性能分析和调优。这些功能包括生成和分析海量数据、跟踪内存泄漏、监控垃圾回…

SpringBoot:异步任务基础与源码剖析

官网文档&#xff1a;How To Do Async in Spring | Baeldung。 Async注解 Spring框架基于Async注解提供了对异步执行流程的支持。 最简单的例子是&#xff1a;使用Async注解修饰一个方法&#xff0c;那么这个方法将在一个单独的线程中被执行&#xff0c;即&#xff1a;从同步执…

系列六、Spring整合单元测试

一、概述 Spring中获取bean最常见的方式是通过ClassPathXmlApplicationContext 或者 AnnotationConfigApplicationContext的getBean()方式获取bean&#xff0c;那么在Spring中如何像在SpringBoot中直接一个类上添加个SpringBootTest注解&#xff0c;即可在类中注入自己想要测试…

java反序列化漏洞详解

java反序列化漏洞 文章目录 java反序列化漏洞漏洞原理漏洞评级漏洞危害漏洞验证漏洞防御典型案例 漏洞原理 由于java开发人员在编写代码时重写了 readObject 方法&#xff0c;在重写的 readObject 方法中调用其他函数实现链式调用最终调用到了危险函数&#xff0c;从而形成反序…

【C++】泛型编程 ⑮ ( 类模板示例 - 数组类模板 | 自定义类中持有指针成员变量 )

文章目录 一、支持 数组类模板 存储的 自定义类1、可拷贝和可打印的自定义类2、改进方向3、改进方向 - 构造函数4、改进方向 - 析构函数5、改进方向 - 重载左移运算符6、改进方向 - 重载拷贝构造函数 和 等号运算符 二、代码示例1、Array.h 头文件2、Array.cpp 代码文件3、Test…

[网鼎杯 2020 朱雀组]phpweb

看一下源码 应该是输入的date 作为函数&#xff0c;value作为内部参数的值&#xff0c;将date()函数返回的结果显示在页面上 回去看的时候&#xff0c;意外发现页面有了新的跳转&#xff0c;观察一下发现&#xff0c;页面每隔五秒就会发生一次跳转 所以就抓包看看 抓包发现po…

GEE:kNN(k-最近邻)分类教程(样本制作、特征添加、训练、精度、最优参数、统计面积)

作者:CSDN @ _养乐多_ 本文将介绍在Google Earth Engine (GEE)平台上进行kNN(k-最近邻)分类的方法和代码,其中包括制作样本点教程(本地、在线和本地在线混合制作样本点,合并样本点等),加入特征变量(各种指数、纹理特征、时间序列特征、物候特征等),运行kNN(k-最近…

Linux中,查看Tomcat版本、如何查看Tomcat版本

方法 在tomcat的bin目录下&#xff0c;执行version.sh命令即可 结果

ElementUI table+dialog实现一个简单的可编辑的表格

table组件如何实现可编辑呢&#xff1f; 我的需求是把table组件那样的表格&#xff0c;实现它点击可以弹出一个框&#xff0c;然后在这个框里面输入你的东西&#xff0c;然后将他回显回去&#xff0c;当然&#xff0c;输入的有可能是时间啥的。 为什么要弹出弹层不在框上直接…

最近iphone手机的交管12123闪退,打不开的解决办法?

苹果手机系统和新版软件不配&#xff0c;终极决绝办法&#xff1a;升级IOS系统就好 可能是手机的内存不足了&#xff0c;因为在使用APP时&#xff0c;需要占用手机的内存&#xff0c;如果手机内存不足以支持软件允许&#xff0c;软件就会闪退。车主可以清理一下手机的内存&…

弹窗msvcp140_1.dll丢失的解决方法,超简单的方法分享

在计算机使用过程中&#xff0c;我们经常会遇到一些错误提示&#xff0c;其中最常见的就是缺少某个文件的错误。最近&#xff0c;我在使用某些软件时&#xff0c;遇到了一个名为“msvcp140_1.dll”的错误提示。这个错误通常出现在运行某些程序时&#xff0c;由于缺少了msvcp140…

项目总结报告(案例模板)

软件项目总结报告模板套用&#xff1a; 项目概要项目工作分析经验与教训改进建议可纳入的项目过程资产 --------进主页获取更多资料-------

2023年【汽车驾驶员(中级)】最新解析及汽车驾驶员(中级)试题及解析

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 2023年汽车驾驶员&#xff08;中级&#xff09;最新解析为正在备考汽车驾驶员&#xff08;中级&#xff09;操作证的学员准备的理论考试专题&#xff0c;每个月更新的汽车驾驶员&#xff08;中级&#xff09;试题及解…