jquery对象和javascript的dom对象转换
Jquery框架为jquery对象定义了独立使用的方法和属性，它无法直接调用dom对象的方法，dom对象也无法直接调用jquery对象的方法和属性。
Jquery对象和dom对象是可以相互转换的，因为他们所操作的对象都是dom元素，只不过jquery对象包含了多个dom元素，而dom对象本身就是一个dom元素，简单地说，jquery对象是dom元素的数组，称为类数组，而dom对象就是单个的dom元素。
1.把jquery对象转换成dom对象
（1）借助数组下标来读取jquery对象集合中的某个dom元素对象。
Var $li = $(‘li’);//jquery对象
Var li = $li[0];//dom对象
（2）借助jquery对象的get()方法
Var $li = $(‘li’);//jquery对象
Var li = $li.get(0);//dom对象
2.dom对象转换为jquery对象
Var li = document.getElementsByTagName(‘div’);
Var $li = $(li[o]);//把第一个div元素封装为jquery对象
Var li = document.getElementsByTagName(‘div’);
Var $li = $(li);//把所以的div元素封装为jquery对象
Load事件必须等到网页中所以内容全部加载完毕后才执行。
当网页中内容很多时，load事件就会延迟
Jquery的ready事件是在dom结构绘制完毕后就执行，也就是说它在外部文件加载之前就执行了，ready事件先于load事件。
Load事件只能被编写一次，但是ready事件可以在同一个文档中多次定义。
<html>
<head>
</head>
<body>
<div class="panel"/>wlecome</div>
<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('<input type="button" value="click me" /><input type="button" value="triggle click me" /><input type="button" value="detach handler" /><input type="button" value="show/hide text" />').appendTo($('body'));
$('input[type="button"]')
.eq(0).click(function(){
$(this).val("红色").addClass('red'); }).end().eq(1).click(function(){
alert(1);
}).end().eq(2).click(function(){
alert(2);
}).end().eq(3).toggle(function(){
$('.panel').hide('slow');
},function(){
$('.panel').show('slow');
}
);
});
</script>
</body>
<html/>
jquery对象和javascript的dom对象转换的更多相关文章
- javaScript操作DOM对象（看三遍，敲三遍，写三遍！ 不会你找我）！！
DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API 使用javaScript操作DOM对象通常分为三类:1.DOM CORE 2.HTM ...
- 第四章 JavaScript操作DOM对象
第四章 JavaScript操作DOM对象 一.DOM操作 DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1988年,W3C发布了第一级 ...
- JavaScript之DOM对象的获取
之前我们讲过JavaScript之DOM对象获取的两篇文章,本文是该系列文章之三,点击回顾上两篇文章能更好地理解本文.<JavaScript之DOM对象的获取(一)>: <JavaS ...
- JavaScript BOM DOM 对象
title: JavaScript BOM DOM 对象 tags: JavaScript --- browser object model document onject model BOM对象 w ...
- jQuery对象与JS原生dom对象之间的转换
jQuery就是JS的一个扩展库,工具库,提供很多方便快捷的方法,所以将JS对象转换为jQuery对象后,能更方便地操作这个对象.但是jQuery对象也不是万能的,有一些JS对象有的能,jQuery对 ...
- JQuery制作网页—— 第三章 JavaScript操作DOM对象
1. DOM:Document Object Model(文档对象模型): DOM操作: ●DOM是Document Object Model的缩 ...
- JavaScript的DOM对象和jQuery对象的对比
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用jQuery快速高效制作网页交互特效-----JavaScript操作DOM对象
一.DOM操作分类 使用JavaScript操作DOM时通常分为三类:DOM Core.HTMl--DOM和CSS-DOM 二.访问节点 节点属性 三.节点信息 四.操作节点的属性 语法: ge ...
- JS、JQuery和ExtJs动态创建DOM对象
做了个简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主要是使用JavaScript.JQuery.ExtJs动态创建Table对象.动态Table数据填充.多选控制. ...
随机推荐
- duplicate files during packaging of apk
OSChina Android APP 导入到Android Studio中不能运行,发现一小插曲. 主要实现了开源中国社区 OSC Android 客户端项目源码通过Gradle方式编译 在 And ...
- OpenSSH的RSA/DSA密钥认证系统
OpenSSH的RSA/DSA密钥认证系统,它可以代替OpenSSH缺省使用的标准安全密码认证系统. OpenSSH的RSA和DSA认证协议的基础是一对专门生成的密钥,分别叫做私用密钥和公用密钥. 使 ...
- 信号的捕捉与sigaction函数
一.内核如何实现信号的捕捉 如果信号的处理动作是用户自定义函数,在信号递达时就调用这个函数,这称为捕捉信号.由于信号处理函数的代码是在用户空间的,处理过程比较复杂,举例如下: 1. 用户程序注册了SI ...
- Linux中断 - tasklet
一.前言 对于中断处理而言,linux将其分成了两个部分,一个叫做中断handler(top half),属于不那么紧急需要处理的事情被推迟执行,我们称之deferable task,或者叫做bott ...
- Python监控Windows下的文件变化
windows下监控文件系统的变化.用python非常方便.实例代码例如以下,非常easy.也不多说了. import os import win32file import win32con ACTI ...
- python标准库介绍——27 random 模块详解
==random 模块== "Anyone who considers arithmetical methods of producing random digits is, of cour ...
- datagrid,treegrid携带参数刷新示例
datagrid携带参数刷新: var queryParams = $("#datagridId").datagrid("options").queryPara ...
- C#特性Attribute学习
起初一直纠结于如何调用特性附着在下面那个成员的值,后来发现不需要调用,通过反射加载的时候是自动绑定上去的,即 获得成员对象之后,有一个方法可以获得特性标签. 其实从类库提供者,和类库使用者的角度,分开 ...
- 在FPGA中使用for循环一定浪费资源吗？
渐渐地,发现自己已经习惯于发现细节,喜欢打破常规,真的非常喜欢这种feel. 相信很多人在书上或者博文上都有提出“在FPGA中使用for语句是很占用资源的”的观点,特权同学也不例外.那么,这种观点正确 ...
- 【Android】20.4 录音
分类:C#.Android.VS2015: 创建日期:2016-03-13 一.简介 利用Android提供的MediaRecorder类可直接录制音频. 1.权限要求 录制音频和视频需要下面的权限: ...