Jquery初步学习

starting

浏览: 197175 次
性别:
来自: 深圳

最近访客更多访客>>

dxr19870317

xtfgq

crest868

ws110d

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

jQuery UI JavaScript HTML XHTML

Jquery初步学习要点：
1.如何获取对象？
$("#idname|.classname|proname|*")
注意：该方法返回的是一个query对象集合，如果加上索引([0])则返回的是一个dom对象,使用each(function)则循环获取DOM对

象,function里面可以使用this对当前dom对象的引用。
ex:
$("#testDiv").each(function() { alert(this) })
$("#testDiv").each(function() { $(this).html("修改内容") })
(this本身是个dom对象如果在$(this)则为一个query对象)

2.取到对象后，如何给对象属性赋值？
第一种方法:使用jquery对象的索引[0](返回dom对象)和其each(functionName)方法获得dom对象，然后就和传统的javascript一样

设置和读取其属性值。
第二种方法：使用jquery对象的attr("property")获取其属性值，针对class，property可以是"class",也可以是"className"，但

为了养成习惯，以后我还是用className吧

3.如何设置属性的值？
这里也是主要用到attr(***)的“重载”方法！
A.attr(properties)：使用{名:"值"[,名:"值"]}的方式对对象进行赋值，需要注意的:cssName:"classTemp"
ex:$("img").attr({ src: "test.jpg", alt: "Test Image" });
B.attr(key,value):使用键值对的方式进行赋值，此中方法一次只能对一个属性进行赋值。
ex:$("img").attr("src","test.jpg");
c.attr(key,functionName):设置key的值，但该值是一个函数返回的。
ex:$("img").attr("title", function() { return this.src });

4.关于删除属性
removeAttr(name):删除name属性。
ex:$("img").removeAttr("src");

附加一个小实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--

-->
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function ui(){
	this.aa="111";
	return this;
};
ui.prototype.testFun=function(){
	var that=this;
	alert(that.aa);
	
}
function test(){
	alert("你点了我哦");
}
$(function (){
	$(".Layer1").each(function (i){
		//alert( this.innerHTML)	
		var _html=$(this).html();
	})
	var layLen=$(".Layer1").size();	
	$("#test").removeAttr("value");
	$("#test").attr("value","测试数据");
	$("#test").attr("onclick","test()");
	
	$("#btn").attr({value:"点击啊",onclick:"test()"})
	var _val=$("#btn").val();
	_val=$("#btn").attr("value");
	var _ui=new ui();
	_ui.testFun();
	
})

</script>
</head>

<body>
<div class="Layer1">1</div>
<div class="Layer1">2</div>
<div class="Layer1">3</div>
<div class="Layer1">4</div>
<input type="text" id="test" name="test" value="xxxx"/>
<input type="button" id="btn" name="btn" value="xxxxbtn"/>
</body>
</html>

分享到：

js封装hashMap并调用 | google map api ---类GMap2

2010-08-11 12:08
浏览 1166
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论