<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. angular中的 input select 值绑定无效,以及多出一个空白选项问题

    问题: <!-- 问题标签 --> <select ng-model="sortType"> <option value="1"& ...

  2. spring mvc集成velocity使用

    目前流行的三大页面视图神器是:老牌大哥jsp.后起之秀freemarker和velocity.这里不详细比较这三者的优劣,总体来说,jsp是标配,但后面两个更严格的执行了视图与业务的分离,页面里是不允 ...

  3. 使用Inno SetUp脚本打包Winform程序

    在开发桌面程序时,往往需要用到打包工具将程序打包为exe可执行文件. 之前在项目中用了下 InstallShield Limited Edition for Visual Studio  2015,它 ...

  4. Python--urllib3库

    Urllib3是一个功能强大,条理清晰,用于HTTP客户端的Python库,许多Python的原生系统已经开始使用urllib3.Urllib3提供了很多python标准库里所没有的重要特性:   1 ...

  5. VC++中如何让RadioButton分组,并且互斥

    首先让两个RadioButton的Group属性为False. 将两个RadioButton放入一个GroupBox里面,即可如果分成多个组,则将多组Radio分别用GroupBox框起来,并将每组的 ...

  6. JMS可靠性机制

    1. 消息接收确认 JMS消息只有在被确认之后,才认为已经被成功的消费了,消息的成功消费通常包含三个阶段:客户接收消息,客户处理消息和消息被确认 在事务性会话中,当一个事务被提交的时候,确认自动发生. ...

  7. 数据科学:numpy.where() 的用法

    原文出处:numpy.where() 用法讲解 原创作者:massquantity numpy.where() 有两种用法: 1. np.where(condition, x, y) 满足条件(con ...

  8. 微信小程序之如何使用iconfont

    如何在小程序中使用iconfont 1.添加入库 2.加入项目 3.下载ttf 4.进行base64处理,在这个平台https://transfonter.org/ 上转换一下格式为base64位. ...

  9. 使用PreparedStatement接口实现增删改操作

    直接上下代码: package com.learn.jdbc.chap04.sec02; import java.sql.Connection; import java.sql.PreparedSta ...

  10. leetcode598

    public class Solution { public int MaxCount(int m, int n, int[,] ops) { ); ); || col == ) { return m ...