<html>

<head>

	<title>jQuery</title>

	<!--导入jquery库-->

	<script type="text/javascript" src="jquery-1.7.2.js"></script>

	<script type="text/javascript">

	/*

	   jQuery(document).ready(

	            function () {

                      alert("AA:jquery加载成功...");

				}

	   );

	   $(document).ready(

	            function () {

                      alert("BB:jquery加载成功...");

				}

	   );

	   $(

	          function () {

                      alert("CC:jquery加载成功...");

				}

	   )

	    */

		$(

	          function () {

                     $("#but").click(

					    function () { alert("按钮事件") }

					 )

				}

	   )

	</script>

	</head>

	<body>

	<div >jQuery</div>

		1. 页码加载监听</br>

			测试添加事件</br>

			<input type="button" value="按钮" id="but"/>

</body>

</html>

rs:

2.Jquery对象和document对象转换

<html>

<head>

	<title>jQuery</title>

	<!--导入jquery库-->

	<script type="text/javascript" src="jquery-1.7.2.js"></script>

	<script type="text/javascript">

		$(function () {

			$("#but1").click(

			function () {

				var oMsg = document.getElementById("msg");//Dom对象

				alert("Dom对象的属性 ： " +oMsg.innerHTML);

			});

			$("#but2").click(

			function () {

				var $msg = $("#msg");//jquery对象

				alert("jquery对象的方法 ： " + $msg.text());

				//alert($msg.innerHTML);	//jquery对象不能访问dom属性

			});

			$("#but3").click(

			function () {

				var oMsg = document.getElementById("msg");//Dom对象

				//转换

				//var $msg = $(oMsg);

				var $msg = jQuery(oMsg);

				alert("jquery对象的方法  ： " +$msg.text());

			});

			$("#but4").click(

			function () {

				var $msg = $("#msg");//jquery对象

				//转换

				//var oMsg = $msg.get(0);

				var oMsg = $msg[0];

				alert(oMsg.innerHTML);	//jquery对象不能访问dom属性

				/*

				var show = "";

				for(var name in $msg) {

					 show+= name + " : " + $msg[name] + "\n";

				}

				alert(show);

				*/

			});

			$("#but5").click(

			function () {

				//var $msg = $("#message");//jquery对象

				var $msg = $("#username");

				//alert($msg.html());

				//alert($msg.text());

				alert($msg.val());

			});

			$("#but6").click(

			function () {

				var $msg = $("#message");

				//$msg.html("<font color='blue'>xml</font>");

				$msg.text("oracle");

			});

			$("#but7").click(

			function () {

				var $img = $("#img");							

				alert($img.attr("src"));

				  $img.attr("src","p2.jpg");

			});

		})

	</script>

	</head>

	<body>

	<div >jQuery对象</div>

	1. 对象<br/>

		<span id="msg">软件</span><br/>

		<input type="button" value="DOM对象" id="but1"/>

		<input type="button" value="jquery对象" id="but2"/>

		<input type="button" value="DOM->jquery" id="but3"/>

		<input type="button" value="jquery->DOM" id="but4"/><br/>

	2. 对象方法<br/>

		<span id="message" value="java"><h3>java</h3></span></br>

		<input type="text" value="张三" id="username"/><br/>

		<img src="2.gif" id="img"/>

		<br/>

		<input type="button" value="取值" id="but5"/>

		<input type="button" value="赋值" id="but6"/>

		<input type="button" value="属性" id="but7"/>

</body>

</html>

rs:

javascript 第26节 jQuery对象的更多相关文章

  1. javascript 第28节 jQuery事件、迭代、样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. javascript 第27节 jQuery选择器

    下面的html需要以下2个文件: 1.style.css div,span,p { width:140px; height:140px; margin:5px; background:#aaa; bo ...

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

    一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...

  4. jQuery对象和普通DOM对象的区别

    1.DOM对象DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的对象.这些对象的行为和属性以及这些对象之间的关系.根据W3C DOM规范,DOM是HTML与XML的应用编程接 ...

  5. jquery对象转成dom对象

     jQuery库本质上还是JavaScript代码,它只是对JavaScript语言进行包装处理,为的是提供更好更方便快捷的DOM处理与开发中经常使用的功能.我们使用jQuery的同时也能混合Java ...

  6. jquery对象和javascript对象相互转换

    本文转载:http://jeiofw.blog.51cto.com/3319919/786506 jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuer ...

  7. JavaScript DOM对象和JQuery对象相互转换

    1.分析源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  8. javascript DOM对象转jquery对象

    首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...

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

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

随机推荐

  1. js主要知识轮廓笔记

    一.js中的基础类型和引用类型: 基础类型:1.Number2.String3.Boolean4.Undefined5.Null 引用类型(内置对象):1.Object类型2.Array类型3.Dat ...

  2. MSSQLSERVER数据库- SQL删除重复数据的五种方式

    删除重复的数据,在平时的工作中还是会和碰到的,感觉挺有用,从网上摘录的,记在这里,以备需要时查阅 --方法一,IN方式,适合2000/2005/2008,6728 毫秒 DELETE [student ...

  3. ObjC语法练习 冒泡排序、选择排序、矩阵相乘

    用OC实现的冒泡排序.选择排序.矩阵相乘,纯粹是用来练习语法. 冒泡排序,程序如下: void bubbleSort() { //初始化数组 NSMutableArray *array1 = [[NS ...

  4. ECSHOP文件目录详解

    ECShop 最新程序 的结构图及各文件相应功能介绍ECShop文件结构目录┣ activity.php 活动列表┣ affiche.php 广告处理文件┣ affiliate.php 生成商品列表┣ ...

  5. JavaScript 原型继承开端

    1.原型继承本质       就javascript对象系统的实现来讲,对象并没有原型,而构造器有原型(构造器.prototype指向其原型).对象只有构造自某个原型的说法,并没有持有某个原型的说法. ...

  6. centos 火狐浏览器安装adobe flash player插件

    来个CentOS 6.3 为Firefox安装Flash插件教程 下载install_flash_player_11_linux.i386.tar.gz打包文件到本地   终端进入install_fl ...

  7. Zookeeper全解析——Paxos作为灵魂

    原文地址: http://www.spnguru.com/2010/08/zookeeper%E5%85%A8%E8%A7%A3%E6%9E%90%E2%80%94%E2%80%94paxos%E7% ...

  8. 更改OS序列号(slmgr)

    slmgr /ipk 489j-abc-def-hij-mnn slmgr /skms 8.8.8.8:1688 slmgr /ato

  9. Android 百度地图API 定位 导航

    看看这个利用百度地图定位并实现目的地导航的Demo. 首先看实现效果:                          进 入后首先会得到当前位置,在地图上显示出来.在输入框中输入目的地后,就会在地 ...

  10. xps13 关机充电 右边的usb口

    bios里设置了 usb powershare但关机的时候还是不能充电 度娘了一下,发现不解决问题,只能放狗了.果然谷歌里搜到答案,是windows的电源策略. I figured it out. A ...