【JQuery】基本用法

学习时顺手做的测试，全是最基本的用法。

 

<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>