DOM对象和jQuery对象的转换

时间:2022-09-23 18:53:29
<script type="text/javascript">

        //js的页面加载事件
window.onload = function () { //获取DOM对象
var inputObj = document.getElementsByTagName("input")[0]; //将DOM对象转换为jQuery对象
var Objquery = $(inputObj); //alertDOM对象
alert(inputObj.value);
//alertjQuery对象
alert(Objquery.val());
} //jQuery的页面加载事件
$(function () {
//获取jQuery对象
var inputQuery = $("input"); //两种方式将jQuery对象转换成DOM对象
var traObj1 = inputjQuery.get(0);
var traObj2 = inputjQuery[0]; //alertjQuery对象
alert(inputQuery.val()); //alertDOM对象
alert(traObj1.value);
alert(traObj2.value);
}) </script>

DOM对象和jQuery对象之间可以相互获取的方式进行转换.

在DOM对象的事件中可以调用jQuery对象的方法和属性,在jQuery对象的事件中可以调用DOM对象的方法和属性.

注意不能使用DOM对象调用jQuery对象的方法和属性,同样不能使用jQuery对象调用DOM对象的方法和属性.

我们可以认为jQuery是对普通DOM的一种高级封装,所以相同需求下,DOM对象使用属性获取值,jQuery对象使用方法获取值.

DOM对象和jQuery对象的转换的更多相关文章

  1. jQuery介绍 DOM对象和jQuery对象的转换与区别

    jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍      jQuery: http://jquery.com/      write less, do more.   j ...

  2. JavaScript 对象、DOM对象、jquery对象的区别、转换详解

    一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...

  3. JQuery &dollar; &dollar;&period;extend&lpar;&rpar;&comma;&dollar;&period;fn和&dollar;&period;fn&period;extend javaScript对象、DOM对象和jQuery对象及转换 工具方法&lpar;utility&rpar;

    一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...

  4. 锋利的jQuery(1)——DOM对象与jQuery对象的转换

    1.认识jQuery DOM对象:即文档对象模型 jQuery对象:通过jQuery包装DOM对象后产生的对象.这是jQuery对象所特有的,在jQuery对象中无法使用DOM对象的任何方法,同时DO ...

  5. jQuery中dom对象与jQuery对象之间互相转换

    首先介绍一下什么是dom对象什么时候jQuery对象 1.dom对象就是使用原生js的api获取到的对象就是dom对象 eg: var box1 = document.getElementById(& ...

  6. DOM对象与jquery对象的互相转换

    一開始总是对DOM对象和jQuery对象搞不清楚.如今对此做一下总结: DOM 对象:文档对象模型.每一份DOM都能够看作一棵树.像ul,li ol  dl  p  h1  等等都是DOM元素节点.能 ...

  7. jQuery入门二(DOM对象与jQuery对象互相转换)

    - DOM对象与jQuery对象互相转换 第一篇说过,DOM对象不能调用jQuery对象的属性和方法,同样jQuery对象也不能调用DOM对象的属性和方法.但是在实际开发中,可能两者间需要互相调用对方 ...

  8. DOM对象和JQuery对象进行转换

    var btn=document.getElementById("btn"); $(btn).click(function(){}); DOM对象转换为JQuery对象: 用$符号 ...

  9. DOM对象与Jquery对象转换

    dom对象的样式是这么加的(js) .style.background = “red”; jquery对象样式是这么加的(jq) .css(“background”,”red”); <div i ...

随机推荐

  1. 【PRINCE2是什么】PRINCE2认证之七大主题(1)

    进入第一个主题,PRINCE2商业论证:PRINCE2指出,商业论证就是进行判断是否值得对项目进行投资,值不值的问题.PRINCE2的商业论证有四个 在项目开始时,开发商业论证.在整个项目生命周期中, ...

  2. Cheat &lpar;tldr&comma; bropages&rpar; - Unix命令用法备忘单

    cheat 是一个Unix命令行小工具,用来查询一些常用命令的惯用法(我们都知道,man page阅读起来太累了,常常是跳到最后去看 examples,但并不是所有man pages里面都有examp ...

  3. android学习笔记40——国际化和资源自适应

    国际化——Internationalization,简称I18N. 本地化——Localization,检查L10N. java国际化资源的思路: java提供国际化资源的思路,是将程序中的标签.提示 ...

  4. Windows Phone 获取网络类型(GSM&sol;CDMA&sol;WIFI&sol;Ethernet)

    一.判断是否有网络数据连接: 最基本的网络状态判断,如果没有网络连接,一切操作都进行不下去啦. Microsoft.Phone.Net.NetworkInformation.NetworkInterf ...

  5. Hadoop MapReduce开发最佳实践(上篇)

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  6. Python机器学习 (Python Machine Learning 中文版 PDF)

    Python机器学习介绍(Python Machine Learning 中文版) 机器学习,如今最令人振奋的计算机领域之一.看看那些大公司,Google.Facebook.Apple.Amazon早 ...

  7. Yii2 console执行定时脚本

    为什么要做crontab脚本 我们的项目使用YII2开发,并不是很大的一个电商平台,pv.IP访问量并不是很高,但客户的数据是日积月累已经产生100万条数据了,之前更新订单等数据使用定时脚本直接访问内 ...

  8. java&period;util&period;concurrent&period;ExecutionException&colon; org&period;apache&period;catalina&period;LifecycleException&colon; Failed to start component &lbrack;StandardEngine&lbrack;Catalina&rsqb;&period;StandardHost&lbrack;localhost&rsqb;&period;StandardContext

    java.util.concurrent.ExecutionException: org.apache.catalina.LifecycleException: Failed to start com ...

  9. OO第四次作业

    一.论述测试与正确性论证的差异 我认为论述测试代表从理论的角度来进行运行正确性的判断,而正确性测试则是从实践的角度来看待程序的正确性问题.两者之间有着明显的差异. 正确性论证是仅仅从代码的逻辑结构方面 ...

  10. 如何在spring-boot web项目中启用swagger

    swagger的三个项目及其作用 我们打开swagger的官网,会发现有三个swagger相关的项目,它们分别是 swagger-editor 作用是通过写代码,生成文档描述(一个json文件或其他格 ...

相关文章