<p id=‘’hello”></p>

普通处理,通过标准JavaScript处理:

var p = document.getElementById('hello');

p.innerHTML = '您好!';

p.style.color = 'red';

jQuery的处理:

var $p = $('#hello');

$p.html('您好!').css('color','red');

jQuery对象转化成DOM对象

1.利用数组下标的方式读取到jQuery中的DOM对象

<div>元素一</div>
<div>元素二</div>
<div>元素三</div> var $div = $('div') //jQuery对象
var div = $div[0] //转化成DOM对象
div.style.color = 'red' //操作dom对象的属性
2.通过jQuery自带的get()方法
var $div = $('div') //jQuery对象
var div = $div.get(0) //通过get方法,转化成DOM对象
div.style.color = 'red' //操作dom对象的属性

DOM对象转化成jQuery对象

var div = document.getElementsByTagName('div'); //dom对象
var $div = $(div); //jQuery对象
var $first = $div.first(); //找到第一个div元素
$first.css('color', 'red'); //给第一个元素设置颜色

jQuery对象与DOM对象及互相转化的更多相关文章

  1. jQuery对象和DOM对象和字符串之间的转化

    jQuery对象和DOM对象和字符串之间的转化 字符串---------->jQuery对象 $(HTML字符串): $('<div>我是祖国的一朵小花</div>') ...

  2. jQuery 对象与 Dom 对象转化

    首先,我们需要知道,为什么我们需要转化两者,原因在于,两者提供的方法不能共用. 比如: $("#id").innerHTML; document.getElementById(id ...

  3. JQuery学习笔记---jquery对象和DOM对象的关系

    1.DOM(Document  Object Model,文档对象模型).DOM树 { html (head&&body),  head(meta && title) ...

  4. jQuery对象和DOM对象的互相转换【 转】

    jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...

  5. 关于jQuery对象与DOM对象

    今天遇到了关于jQuery对象与dom对象的区分问题.具体如下:对于元素<span id="aa" class="aa">hyz</span& ...

  6. JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

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

  7. 【Jquery系列】详解Jquery对象和Dom对象

    问题描述 本篇文章主要讲解Jquery对象和DOM对象,主要围绕如下五个方面来介绍: Jquery对象和dom对象定义 Jquery对象与dom对象区别 Jquery对象及运用举例 dom对象及运用举 ...

  8. jQuery对象转换为DOM对象(转)

    jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...

  9. jQuery对象与DOM对象的相互转化

    jQuery是一个类数组对象,DOM对象就是一个单独的DOM元素,他们都是可以操作的DOM元素. 一.jQuery对象转化为DOM对象 有以下两种方法: 方法一:利用数组下标的方式读取jQuery中的 ...

随机推荐

  1. fn project Function files 说明

    主要是文件 func.yaml func.json 详细说明如下: An example of a function file: name: fnproject/hello version: 0.0. ...

  2. STM32GPIO管脚设置

    (1)GPIO_Mode_AIN 模拟输入 (2)GPIO_Mode_IN_FLOATING 浮空输入(3)GPIO_Mode_IPD 下拉输入 (4)GPIO_Mode_IPU 上拉输入 (5)GP ...

  3. flask之redis

    redis 连接需要host port passwod Hash:key-fields-value(做缓存)相当于一个key对于一个map,map中还有key-valueList:有顺序可重复(处理不 ...

  4. file_put_contents以及file_get_contents的用法与在使用过程中遇到的问题(PHP学习)

    对数据的操作最基本的是增删改查,file_put_contents以及file_get_contents是对文件里的数据进行存入与取出. 先上代码: <?php $str = 'hello wo ...

  5. git fatal: remote origin already exists. 报错解决

    在研究git的时候,随便输了个 git remote add origin xxx; 然后再真正add 远程仓库的时候,报了git fatal: remote origin already exist ...

  6. fineUI表格控件各属性说明

    最近在新的公司后台用fineUI,所以也稍微总结一下表格的一些属性,希望对刚入手的人有些帮助: AllowPaging 允许分页,为true时表示允许分页,表格下方会出现分页工具栏: PageSize ...

  7. linux解压缩基本命令使用

    解压缩命令1.gzip 只能压缩文件,不可压缩目录,压缩后不保留原文件gzip a.txt会删除原文件 生成.gz后缀的文件 a.txt.gz2.gunzip解压.gz的文件gzip -d a.txt ...

  8. Does Windows have a limit of 2000 threads per process?

    http://blogs.msdn.com/b/oldnewthing/archive/2005/07/29/444912.aspx Often I see people asking why the ...

  9. juc原子类之二:基本类型原子类AtomicInteger(AtomicLong、AtomicBoolean)

    一.AtomicInteger简介 AtomicInteger, AtomicLong和AtomicBoolean这3个基本类型的原子类的原理和用法相似.以AtomicInteger对基本类型的原子类 ...

  10. C# 32位程序访问64位注册表

    接上文:http://www.cnblogs.com/TaiYangXiManYouZhe/p/5086974.html 上代码: RegistryKey localKey; if (Environm ...