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

1、认识jQuery

  1. DOM对象:即文档对象模型
  2. jQuery对象:通过jQuery包装DOM对象后产生的对象。这是jQuery对象所特有的,在jQuery对象中无法使用DOM对象的任何方法,同时DOM对象也不能使用jQuery对象的方法。(这也是我自己在写代码的时候经常弄混的一条)
  3. DOM对象和jQuery对象的互换:一般的在jQuery对象前面加上$
    • jQuery对象转换成DOM对象:

      • Jquery对象是一个类似数组的对象,可以通过[index]的方法得到相应的DOM对象

        //代码如下
          var $cr = $("#cr");  //Jquery对象
          var cr = $cr[0];        //DOM对象
      • 另外一种方法是Jquery本身提供的,通过get(idnex)方法得到相应的DOM对象

        //代码如下
          var $cr = $("#cr");  //Jquery对象
          var cr = $cr.get[0];        //DOM对象
        
    • DOM对象转换为Jquery对象
      • 对于DOM对象,只需要用$()把对象包装起来,就可以获得一个jQuery对象

        //代码如下
          var cr = document.getElementById("cr");  //DOM对象
          var $cr = $(cr);        //Jquery对象
时间: 2024-10-11 00:45:09

锋利的jQuery(1)——DOM对象与jQuery对象的转换的相关文章

jQuery复习—DOM无关的jQuery实用函数

DOM无关的jQuery实用函数 一.实用函数的定义 定义在jQuery/$命名空间下不操作包装集的函数.一般来说这些使用函数要么操作除DOM元素以外的JavaScript对象,要么执行一些与Dom操作无关的操作. 二.操作JavaScript对象和集合 1.修建字符串  $.trim(value) 定义:删除传入的字符串开头和结尾处的空白字符,并返回修改后的结果 参数:value需要修改的字符串 返回值:修改后的字符串 $.trim($('#someFiled').val()); 2.遍历属性

jQuery的dom操作(二)转

addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之后插入内容. append() 向匹配的元素内部追加内容. appendTo() 向匹配的元素内部追加内容. attr() 设置或返回匹配元素的属性和值. before() 在每个匹配的元素之前插入内容. clone() 创建匹配元素集合的副本. detach() 从 DOM 中移除匹配元素集合. empty() 删除匹配的元素集合中所有的子节点. hasClass() 检查匹配的元素是否拥有指定的类. html(

锋利的jQuery——DOM对象与jQuery对象的区别

DOM对象 <h3>例子</h3> <p title="选择你喜欢的水果">你最喜欢的水果是?</p> <ul> <li>苹果</li> <li>橘子</li> <li>菠萝</li> </ul> <h3><p><ul><li>都是DOM对象,在javascript中可以使用getElementB

DOM对象和js对象以及jQuery对象的区别

一.DOM对象 文档对象模型简称DOM,是W3C组织推荐的处理可扩展置标语言的标准编程接口. DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的对象.这些对象的行为和属性以及这些对象之间的关系. 通过DOM,可以访问所有的 HTML 元素,连同它们所包含的文本和属性.可以对其中的内容进行修改和删除,同时也可以创建新的元素. HTML DOM 独立于平台和编程语言.它可被任何编程语言诸如 Java.JavaScript 和 VBScript 使用. DOM对象,即是我们用

认识JQuery,JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作,常用的方法

(一)认识JQuery  JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法    JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法 格式:$(selector).actio

jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、

this指的是原生js的DOM对象 .css(""):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(""):获取元素   标签名..类名.#id jQuery特点 链式编程 jq.shou(3000).html(内容) 相当于 jq.shou(3000) jq.gtml(内容) 隐式迭代 隐式实用for循环.迭代 如何使用jQuery 引包 一定要在使用之前 <script src =

DOM对象和jQuery对象

1.DOM对象 Document Object Model,文档对象模型.通过html Dom可访问所有元素 获取方法有:1.通过id找到元素 document.getElementById("id") 2.通过标签名找到元素对象集合  document.getElementsByTagName("");   3.通过名称找到元素对象集合  document.getElementsByName(name); 2.jQuery对象 通过jQuery包装DOM对象后产生

DOM对象与JQUERY对象的相互转化

普通处理,通过标准JavaScript处理: 1 var p = document.getElementById('imooc') 2 p.innerHTML = '您好!学习jQuery才是最佳的途径'; 3  p.style.color = 'red'; 通过原生DOM模型提供的document.getElementById("imooc") 方法获取的DOM元素就是一个DOM对象,再通过innerHTML与style属性处理文本与颜色. jQuery的处理: 1 var $p =

jQuery easyUI id选择器 类选择器 标签选择器 属性选择器 及DOM对象和jQuery相互之间的转换

首先导入js文件 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"