<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. Spring ApplicationContextAware获取上下文

    一.ApplicationContextAware 用处 Spring 提供了ApplicationContextAware类,通过它可以获取所有bean上下文. 二.怎么用? ①.定义一个工具类,去 ...

  2. powershell.exe直接运行命令

    powershell.exe -Command "& { ('time={0},user={1}' -f (get-date),(whoami)) | Out-File " ...

  3. Update操作浅析，一定是先Delete再Insert吗？

    Update操作一定是先Delete再Insert吗? Update在数据库中的执行是怎么样的?“Update操作是先把数据删除,然后再插入数据”.在网上看了很多也都是这么认为的.但在查阅到一些不同看 ...

  4. Swipe2.1更新——移动Web内容滑块

    Swipe JS 是一个轻量级(3.7 kb) mobile slider,支持 1:1 触摸移动(基于精确的触摸位置的内容滑动). 但是我使用一段时间后发现两个bug,所以在官方2.0(官网http ...

  5. mysqldump原理5

    http://blog.csdn.net/niu870781892/article/details/6186078 导出多张表的时候表之间用空格分开: # mysqldump -h192.168.25 ...

  6. js数组定义和获取其长度

    1.只有值组成的数组,必须先定义数组对象. 定义 var arrs=new array()或 var arrs=[]; 赋值: arrs[]="he";arrs[]="c ...

  7. java RSA加密解密--转载

    原文地址:http://www.blogjava.net/icewee/archive/2012/05/19/378570.html 该工具类中用到了BASE64,需要借助第三方类库:javabase ...

  8. JS 笔记

    如何定义一个函数呢?基本语法如下: function 函数名() {      函数代码; } 说明: 1. function定义函数的关键字. 2. "函数名"你为函数取的名字. ...

  9. lambda expand in list

    [(lambda x: x*x)(x) for x in range(10)] Or better yet: [x*x for x in range(10)]

  10. centos中安装jdk方法

    RPM安装方法一: 1.检验系统原版本[root@zck ~]# java -versionjava version "1.6.0_24"OpenJDK Runtime Envir ...