<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. 【Stage3D学习笔记续】山寨Starling（十二）：总结和一些没提到的东西

    我们的山寨Starling到这里就告一段落了,不得不说这是一个非常优秀的2D框架,他的设计和架构为后来的许多框架都提供了很好的参考,比如现在正在崛起的Egret,我们的一番解读也只是窥见了Starli ...

  2. view 与layer

      文章出处:http://blog.csdn.net/iukey 一.添加 Quartz Core 框架 要使用 Quartz Core 框架,你需要将其添加到你的工程中 . 然后  #import ...

  3. ios 说一说UINavigationController 的堆栈

    iOS的界面堆栈管理比android的要好用很多. 这里写两点:一点是 如何重回前面的vc,而不是push一个alloc的新界面.第二点就是判断当前堆栈显示的vc是何vc. vc堆栈: vc1-> ...

  4. 创建、显示和删除保存的用户名和密码（cmdkey）

    创建,显示和删除保存的用户名和密码: cmdkey.exe /add:targetname /user:username /pass:password

  5. http://www.360doc.com/content/10/1012/09/3722251_60285817.shtml

    http://www.360doc.com/content/10/1012/09/3722251_60285817.shtml http://www.docin.com/p-163063250.htm ...

  6. [Practical Git] Format commit history with git log arguments

    When running the git log command, we can pass in options as arguments toformat the data shown for ea ...

  7. [Javascript] Introduce to Webpack

    To use webpack, first you need to run: npm install webpack 2. Create a webpack.config.js file: modul ...

  8. PAT 1014

    1014. Waiting in Line (30) Suppose a bank has N windows open for service. There is a yellow line in ...

  9. 建索引让SQL飞起来

    今天帮助看了一个哥们的数据库,帮他抓了一下等待事件,刚好有一个sql在等待事件中,顺便看看 监控等待事件 select a.SID, a.EVENT, b.OSUSER, b.username, b. ...

  10. eclipse安装插件的方法，以python为例子

    一 转载自:http://www.cnblogs.com/linzhenjie/articles/2639113.html 1.基本需求 1.Eclipse 集成开发环境下载 http://115.c ...