学习时顺手做的测试,全是最基本的用法。
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script language="javascript" type="text/javascript">
//Ajax
$(document).ready(function(){
$("#btn1").click(function(){
$.get("Ajax.ashx",{name:$("#txt1").val(),pass:$("#txt2").val()},function(response){
$("#div1").html(response);
});
});
});
//三种选择器
$(document).ready(function(){
$("span").html("标签选择器");
});
$(document).ready(function(){
$(".span1").html("应用样式选择器");
});
$(document).ready(function(){
$("#span1").html("类选择器");
});
/**
/*调用函数,测试失败。$(document).ready(f1()); 2010年12月12日21:40:56
/*如下,成功。 2010年12月12日21:52:48
*/
function f1(){
$("#Button1").click(function(){
alert("调用函数");
});
}
$(document).ready(function(){
f1();
});
// $(document).ready(f1());
//根据属性名获取或设置属性
$(document).ready(function(){
$("#span2").attr("style","color:blue");//获取只需第一个参数
});
//标签删选和多重筛选
$(document).ready(function(){
$("input[type='text'][name='sx']").attr("value","筛选");//为筛选出来的元素设置属性
$("input[type='text'][name='sx']").attr("readonly","readonly");
});
</script>
HTML部分
<div>
<!--Ajax-->
<input type="text" id="txt1" />
<input type="text" id="txt2" />
<input type="button" id="btn1" value="Test" />
<div id="div1"></div>
<br />
<!--选择器-->
<span id="span1">初始值</span><br />
<span class="span1">初始值</span><br />
<span >初始值</span><br />
<span class="span1">初始值</span><br />
<br /><br /><br />
<input type="button" id="Button1" value="测试调用函数" />
<br /><br /><br />
<!--根据属性名获取或设置属性-->
<span id="span2" style="color:red">根据属性名获取或设置属性</span>
<br /><br /><br />
<!--标签删选和多重筛选-->
<input type="text" name="sx" />
<input type="text" />
<input type="text" name="sx" />
<input type="text" />
</div>