!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
<html>
<head>
<title></title>
<script type="text/javascript" src="JQuery/jquery-1.5.1.js"></script>
</head>
<body>
<!--文本-->
<input type="text" name="text1" id="text1" class="text1" value="nihao shijie"/>
<input type="text" name="text2" id="text2" class="" value=""/>
<input type="text" name="text3" id="text3" class="text3" value="nihao dalian"/><br/>
<!--文字-->
<div name="div1" id="div1" class="div1"><span name='span1' id="span1" value="a">Hello World!</span></div>
<!--按钮-->
<input type="button" name="b1" id="b1" value="显示"/>
<input type="button" name="b2" id="b2" value="隐藏"/><br/>
<input type="button" name="b3" id="b3" value="修改内容为 Hello World,too!"/><br/>
<p id="pp">sadfsadf</p>
<style type="text/css">
.text2{color:#CC33FF};
.text3{background:#6600FF};
#b4{background:#6600FF};
</style>
<script type="text/javascript">
//显示
$("input[name='b1']").bind("click",function(event){
$("div[name='div1']").show();
});
//隐藏
$("#b2").bind("click",function(event){
$("#div1").hide();
});
//改变显示值
$("input[id='b3']").bind("click",function(event){
$("span[id='span1']").html("Hello World ,too!");
});
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!获取dom元素
//直接获取所有此标签元素
//var a=$("input");
//获取input下所有text属性的input标签
//var a=$("input:text");
//获取class为text1的所有元素值
//var a=$(".text1").val()+"ttttttttt<br>";
//document.write(a);
//获取id为text1的所有元素值
//var a=$("#text1").val()+"ttttttttt<br>";
//document.write(a);
//将id为table1下的id为tr1的元素复制,加在tr2前面
//var tr1=$("#table1 #tr1").clone(true);
//tr1.insertBefore("#tr2");
//将id为table1下的HTML的tr标签元素复制,加在tr2前面
//var tr1=$("#table1 tr").clone(true);
//tr1.insertBefore("#tr2");
//!!!!!!!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!!!!!!!通过索引或指定值查找某一确定元素
//通过其标签名查找元素
//var a=$("input[name='text1']").val()+"世界你好<br>";
//document.write(a);
//同理通过ID名查找元素
//var a=$("input[id='text3']").val()+"你好大连";
//document.write(a);
//根据其索引值查找元素
//var a=$("input:eq(1)").val()+"网";
//document.write(a);
//获取索引中第二个input标签的值同上
//var a=$("input").eq(1).val();
//document.write(a);
//用对象后面加[]索引查找元素,此方法提出的对象不能用jquery中函数,此时取值不能用val(),只能用value
//var a=$("input")[0].value;
//document.write(a);
//!!!!!!!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!!!!!!!对dom元素进一步操作
//!!!!!!!!!!!!!
//!!!!!!!!!!!!!标签属性
//为input标签的第二个索引对象的value属性赋值,你好世界如果。如果dom对象是个集合则为集合内所有对象value属性赋值
//$("input").eq(1).attr("value","你好世界");
//同时对指定input的多个属性赋值
//$("input").eq(1).attr({value:"你好中国",id:"text2"});
//获取input第一个索引对象的value属性的值
//$("input").eq(0).attr("value")
//移除input标签第一个索引的value属性
//$("input").eq(0).removeAttr("value");
//!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!样式表
//为input标签索引为第二的的dom元素class属性添加样式表中名称为text2的类的样式
//$("input").eq(1).addClass("text2");
//删除指定input的class=text3的值,如果removeClass()括号内为空则删除所有class值
//$("input").eq(2).removeClass("text3");
//!!!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!!!对具体某个style属性进行操作
//获取指定input中指定style属性的的值
//a=$("input").eq(1).css("color");
//document.write(a);
//给body元素添加指定style属性及值的css样式
//$("body").css("background","black")
//为指定input设置指定style属性及值
//$("input").eq(2).css({color:"#ff0011",background:"#6600FF"});
//!!!!!!!!!!!!!!!!!!!!!!!!
//!!!!!!!!!!!!!!!!!!!!!!!!其他操作
//隐藏form表单
//$("form").hide();
//添加一个"<div><p>Hello</p></div>"到body页面中
//$("<div><p>Hello</p></div>").appendTo("body");
//将name=text1的input框移到此处显示注意是移动,不是复制
//$("input[name='text1']").appendTo("body");
//获取<p>相对当前窗口的坐标位置,offset()返回当前对象left,top两个整型属性
//var a=$("p");
//var b=a.offset();
//a.html("left:"+b.left+",top:"+b.top);
//position()用法同offset()获取相对父元素的坐标位置,同样返回left,top两个整型属性
</script>
</body>
</html>