一開始总是对DOM对象和jQuery对象搞不清楚。如今对此做一下总结:

DOM 对象:文档对象模型。每一份DOM都能够看作一棵树。像ul,li ol  dl  p  h1  等等都是DOM元素节点。能够通过js的getElementsByTagName  和 getElementById  来获取这些元素节点。像这样得到的DOM元素就是DOM对象。

DOM对象能够使用javascript中的方法。如:

var domObj = document.getElementById("id");

var objHtml = domObj.innerHTML;

jquery对象就是通过jquery包装DOM对象后产生的对象。

jquery对象能够使用jquery中的方法。

如:

$("#foo").html();

这段代码等同于document.getElementById("foo").innerHTML;

当然。jquery对象和DOM对象能够相互转换:

jquery提供了两种方法将jquery对象转换成DOM对象:即[index] 和 get(index)

var $cr = $("#cr");             //jquery对象

var cr = document.getElementById("cr");      //DOM对象

如今将它们进行相互转换:

将jquery对象转换成DOM对象:

var $cr = $("#cr");

var  cr = $cr[0];      //将jquery对象转换成了DOM对象。

将DOM对象转换成jquery对象:

var cr = document.getElementById("cr");     //声明了DOM对象

var $cr = $(cr);            //将DOM对象转换成了jquery对象

一般是在jquery没有封装想要的方法,不得不使用DOM对象的时候。就须要对jquery对象转换成DOM对象。

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 $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

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

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

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

  5. DOM对象和jQuery对象的转换

    <script type="text/javascript"> //js的页面加载事件 window.onload = function () { //获取DOM对象 ...

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

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

  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. 建设一个能承受500万PV/每天的网站如果计算?

    PV是什么: PV是page view的简写.PV是指页面的访问次数,每打开或刷新一次页面,就算做一个pv. 计算模型: 每台服务器每秒处理请求的数量=((80%*总PV量)/(24小时*60分*60 ...

  2. uiviewcontroller顶级布局控制

    @available(iOS 7.0, *) open var edgesForExtendedLayout: UIRectEdge // Defaults to UIRectEdgeAll @ava ...

  3. 经典问题——输出n对括号的所有组合

    问题 n对括号有多少种合法的组合,比如两对括号可以有两种:()()和(()) 思路 问题等价为:在一个字符串中包含两种字符:'('和')',他们出现的次数都为n,并且任何时候'('出现的次数总是大于或 ...

  4. 面包屑 asp代码记录 newsmulu_class 内部函数

    'id 这里其实是 classId 'mbStr1 最右边的栏目模板 由于是当前本页面 就不带链接了 建议默认值:<span class='mbxC'>$title</span> ...

  5. element-UI el-table二次封装

    Part.1 为什么要二次封装? 这是 Element 网站的 table 示例: <template> <el-table :data="tableData" ...

  6. Win7 与win10绘制桌面壁纸的区别

    win7使用csrss.exe绘制壁纸. win10使用explorer.exe绘制壁纸.

  7. mac vim设置python语法高亮

    1 "显示行号  2 set nu  3   4 "设置缩进tabstop  5 set ts=4  6 set shiftwidth=4  7 set expandtab  8 ...

  8. 微信小程序中自定义modal

    微信小程序中自定义modal .wxml <modal hidden="{{hidden}}" title="这里是title" confirm-text ...

  9. -- HTML标记大全参考手册[推荐]

    --  HTML标记大全参考手册[推荐]总类(所有HTML文件都有的) 文件类型 <HTML></HTML> (放在档案的开头与结尾) 文件主题 <TITLE>&l ...

  10. 关于C/C++的一些思考(4)

    C++的类型转换规则: 对于数值类型而言:当一个较小数值类型赋值给一个较大数值类型的时候,C++支持隐式的类型转换,不会有任何的损失: 对于数值类型而言,当一个较大数值类型赋值给一个较小数值类型时候, ...