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

发布时间:2017-1-23 12:29:20 编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"JavaScript 对象、DOM对象、jquery对象的区别、转换详解 ",主要涉及到JavaScript 对象、DOM对象、jquery对象的区别、转换详解 方面的内容,对于JavaScript 对象、DOM对象、jquery对象的区别、转换详解 感兴趣的同学可以参考一下。

一、JavaScript 对象JavaScript 提供多个内建对象,比如 String、Date、Array 等等。对象只是带有属性和方法的特殊数据类型。访问对象的属性:[javascript] var message="Hello World!";  var x=message.length;   创建 JavaScript 对象:[javascript] person=new Object();  person.firstname="Bill";  person.lastname="Gates";  person.age=56;  person.eyecolor="blue";   使用对象构造器:[javascript] view plaincopyfunction person(firstname,lastname,age,eyecolor)  {  this.firstname=firstname;  this.lastname=lastname;  this.age=age;  this.eyecolor=eyecolor;  }  [javascript] var myFather=new person("Bill","Gates",56,"blue");  var myMother=new person("Steve","Jobs",48,"green");   二、DOM对象DOM实际上是以面向对象方式描述的文档模型。DOM定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。根据W3C DOM规范,DOM是HTML与XML的应用编程接口(API)。通过 DOM,可以访问所有的 HTML 元素,连同它们所包含的文本和属性。可以对其中的内容进行修改和删除,同时也可以创建新的元素。HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用。DOM对象,即是我们用传统的方法(javascript)获得的对象。 三、jQuery对象jquery对象其实是一个javascript的数组这个数组对象包含125个方法和4个属性4个属性分别是jquery     当前的jquery框架版本号length     指示该数组对象的元素个数context    一般情况下都是指向HtmlDocument对象   selector   传递进来的选择器内容  如:#yourId或.yourClass等 如果你通过$("#yourId")方法获取jquery对象,并且你的页面中只有一个id为yourId的元素那么$("#yourId")[0]就是HtmlElement元素与document.getElementById("yourId")获取的元素是一样的 简单理解,就是jQuery创建的对象jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法 四、DOM对象和jquery对象的区别[javascript] var domObj = document.getElementById("id"); //DOM对象  var $obj = $("#id"); //jQuery对象;  [javascript]  $(“#img”).attr(“src”,”test.jpg”); //这里的$(“#img”)就是获取jQuery对象;  [javascript]  document.getElementById(“img”).src=”test.jpg”;//这里的document.getElementById(“img”)就是DOM对象;  再说一个例子:就是this,我在写jQuery的时候经常这样写:this.attr(“src”,”test.jpg”);可是就是出错。其实this是DOM对象,而.attr(“src”,”test.jpg”)是jQuery方法,所以出错了。要解决这个问题就要将DOM对象转换成jQuery对象,例如:$(this).attr(“src”,”test.jpg”); 五、DOM对象和jquery对象的转换DOM对象转成jQuery对象:对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。方法:$(DOM对象)[javascript] var v=document.getElementById(“v”);  //DOM对象  var $v=$(v);    //jQuery对象   jQuery对象转成DOM对象:两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。[javascript]  var $v =$(“#v”) ; //jQuery对象  var v=$v[0];    //DOM对象  alert(v.checked)   //检测这个checkbox是否被选中   (2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象。[javascript] var $v=$(“#v”);  //jQuery对象  var v=$v.get(0);   //DOM对象  alert(v.checked)  //检测这个checkbox是否被选中   

上一篇:Angular2入门系列教程4-服务
下一篇:春运来了,刷票是必备的技能。

相关文章

相关评论