DOM对象与jquery对象的互相转换
一開始总是对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对象的互相转换的更多相关文章
- jQuery介绍 DOM对象和jQuery对象的转换与区别
jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍 jQuery: http://jquery.com/ write less, do more. j ...
- JavaScript 对象、DOM对象、jquery对象的区别、转换详解
一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...
- JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)
一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...
- 锋利的jQuery(1)——DOM对象与jQuery对象的转换
1.认识jQuery DOM对象:即文档对象模型 jQuery对象:通过jQuery包装DOM对象后产生的对象.这是jQuery对象所特有的,在jQuery对象中无法使用DOM对象的任何方法,同时DO ...
- DOM对象和jQuery对象的转换
<script type="text/javascript"> //js的页面加载事件 window.onload = function () { //获取DOM对象 ...
- jQuery中dom对象与jQuery对象之间互相转换
首先介绍一下什么是dom对象什么时候jQuery对象 1.dom对象就是使用原生js的api获取到的对象就是dom对象 eg: var box1 = document.getElementById(& ...
- jQuery入门二(DOM对象与jQuery对象互相转换)
- DOM对象与jQuery对象互相转换 第一篇说过,DOM对象不能调用jQuery对象的属性和方法,同样jQuery对象也不能调用DOM对象的属性和方法.但是在实际开发中,可能两者间需要互相调用对方 ...
- DOM对象和JQuery对象进行转换
var btn=document.getElementById("btn"); $(btn).click(function(){}); DOM对象转换为JQuery对象: 用$符号 ...
- DOM对象与Jquery对象转换
dom对象的样式是这么加的(js) .style.background = “red”; jquery对象样式是这么加的(jq) .css(“background”,”red”); <div i ...
随机推荐
- Vue打包之后部署到 express 服务器上
Part.1 安装 express npm install express body-parer --save Part.2 在项目根目录下创建 app.js 文件作为启动 express 服务器代码 ...
- 如何修改MFC的图标
原文:如何修改MFC的图标 修改左上角的图标和任务栏里图标 在对话框构造函数中 CTestDlg::CTestDlg(CWnd* pParent /*=NULL*/) : CDialog(CTestD ...
- 在CentOS6.4上安装GitLab
1.Install and configure the necessary dependencies On CentOS 6 (and RedHat/Oracle/Scientific Linux 6 ...
- Python使用Flask框架,结合Highchart,自定义导出菜单项目及顺序
参考链接: https://www.highcharts.com.cn/docs/export-module-overview https://api.hcharts.cn/highcharts#ex ...
- 新增feeds模块
很简单,参考<产品差异化定制> 1.在fees/luci/model下面新增文件夹,必须的有:Makefile 和 luasrc/controller/admin/xxx.lua 2.执行 ...
- LNMP构架搭建论坛
1 yum install -y apr* autoconf automake bison bzip2 bzip2* compat* cpp curl curl-devel fontconfig fo ...
- Codeforces450 B. Jzzhu and Sequences
B. Jzzhu and Sequences time limit per test 1 second memory limit per test 256 megabytes input standa ...
- PHP 处理接口保证数据安全性
原地址:http://blog.csdn.net/lhbeggar/article/details/46377653 php做APP接口时,如何保证接口的安全性? 1.当用户登录APP时,使用http ...
- Jbox 弹出窗口 子页面操作完成后关闭 父页面刷新
父页面js //父页面js <script> var isFreshFlag = '1'; //添加会议活动 function addMeetingAct(){ var attendVip ...
- 关于Windows 10 初始安装的VS2013 SSDT-BI 的BUG 问题
初始安装,正常安装会出现以下出现信息,随后会被告知未安装成功. 关于SSDT-BI信息可以参见这里 http://jimshu.blog.51cto.com/3171847/1420469 从Wind ...