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 ...
随机推荐
- 建设一个能承受500万PV/每天的网站如果计算?
PV是什么: PV是page view的简写.PV是指页面的访问次数,每打开或刷新一次页面,就算做一个pv. 计算模型: 每台服务器每秒处理请求的数量=((80%*总PV量)/(24小时*60分*60 ...
- uiviewcontroller顶级布局控制
@available(iOS 7.0, *) open var edgesForExtendedLayout: UIRectEdge // Defaults to UIRectEdgeAll @ava ...
- 经典问题——输出n对括号的所有组合
问题 n对括号有多少种合法的组合,比如两对括号可以有两种:()()和(()) 思路 问题等价为:在一个字符串中包含两种字符:'('和')',他们出现的次数都为n,并且任何时候'('出现的次数总是大于或 ...
- 面包屑 asp代码记录 newsmulu_class 内部函数
'id 这里其实是 classId 'mbStr1 最右边的栏目模板 由于是当前本页面 就不带链接了 建议默认值:<span class='mbxC'>$title</span> ...
- element-UI el-table二次封装
Part.1 为什么要二次封装? 这是 Element 网站的 table 示例: <template> <el-table :data="tableData" ...
- Win7 与win10绘制桌面壁纸的区别
win7使用csrss.exe绘制壁纸. win10使用explorer.exe绘制壁纸.
- mac vim设置python语法高亮
1 "显示行号 2 set nu 3 4 "设置缩进tabstop 5 set ts=4 6 set shiftwidth=4 7 set expandtab 8 ...
- 微信小程序中自定义modal
微信小程序中自定义modal .wxml <modal hidden="{{hidden}}" title="这里是title" confirm-text ...
- -- HTML标记大全参考手册[推荐]
-- HTML标记大全参考手册[推荐]总类(所有HTML文件都有的) 文件类型 <HTML></HTML> (放在档案的开头与结尾) 文件主题 <TITLE>&l ...
- 关于C/C++的一些思考(4)
C++的类型转换规则: 对于数值类型而言:当一个较小数值类型赋值给一个较大数值类型的时候,C++支持隐式的类型转换,不会有任何的损失: 对于数值类型而言,当一个较大数值类型赋值给一个较小数值类型时候, ...