jquery测试文档

Jquery版本：* jQuery JavaScript Library v1.3.2 * http://jquery.com/
 
引用：<script src="JS/jquery.js" type="text/javascript"></script>
 
测试1：给隐藏域赋值：
 
控件：<input type="hidden" id="hdInfo" />
 
脚本：function aa()
 
     {
 
          jQuery("#hdInfo").val('test');
 
          alert(jQuery("#hdInfo").val());
 
          //等价于
 
           $("#hdInfo").val('test');
 
          alert($("#hdInfo").val());          

     }
 
测试2：获得table第一列的所有数据：
 控件：<table cellspacing="0" rules="all" border="1" id="dataGridView1" style="border-collapse:collapse;"> 
       <tr>
 
             <th scope="col">编号</th><th scope="col">学号</th><th scope="col">姓名</th><th scope="col">课程编号</th><th scope="col">课程名称</th><th scope="col">分数</th>
 
       </tr><tr>
 
            <td>1</td><td>2005001     </td><td>张三    </td><td>10001</td><td>数学                </td><td>69</td>
 
       </tr><tr>
 
            <td>2</td><td>2005001     </td><td>张三    </td><td>10001</td><td>数学                </td><td>69</td>
 
       </tr><tr>
 
            <td>3</td><td>2005001     </td><td>张三    </td><td>10002</td><td>语文                </td><td>78</td>
 
       </tr><tr>
 
            <td>4</td><td>2005001     </td><td>Thomas</td><td>10002</td><td>语文                </td><td>78</td>
 
       </tr><tr>
 
            <td>5</td><td>2005002     </td><td>李四    </td><td>10001</td><td>数学                </td><td>89</td>
 
       </tr>
 
</table>
 
 
 
脚本：function aa()
 
     {
 
         alert(jQuery("#dataGridView1 tr td:first-child").text());  
 
//alert(jQuery("table tr td:first-child").text()); //通用型        

     }
 
测试3：获得所选中的radio中lable中的值：
 
控件：  <input id="rblProject_0" type="radio" name="rblProject" value="A" /><label for="rblProject_0">A  已经使用</label></td><td><input id="rblProject_1" type="radio" name="rblProject" value="B" /><label for="rblProject_1">B  近期上线 </label></td><td><input id="rblProject_2" type="radio" name="rblProject" value="C" /><label for="rblProject_2">C  尚无规划 </label></td><td><input id="rblProject_3" type="radio" name="rblProject" value="D" checked="checked" /><label for="rblProject_3">D  不清楚 </label>
 
 
 
脚本：function aa()
 
     {
 
         alert(jQuery("input[name='rblProject']:checked").next("label").html()); //或者用下面的方式也可以得到值
 
         alert(jQuery("input[name='rblProject']:checked").next("label").text());           
 
     }
 
测试4：超连接标签选中时更改样式：
 
控件：  <asp:TreeView ID="stv1" runat="server" ShowLines="true"   ImageSet="Arrows"  >     

        <HoverNodeStyle Font-Bold="True" Font-Underline="True" ForeColor="#5555DD" />
 
        <ParentNodeStyle Font-Bold="False" />
 
        <SelectedNodeStyle Font-Bold="True" Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px" VerticalPadding="0px" />
 
        <NodeStyle Font-Names="Tahoma" Font-Size="10pt" ForeColor="Black" HorizontalPadding="5px"  NodeSpacing="0px" VerticalPadding="0px" />
 
    </asp:TreeView>
 
脚本：jQuery( function()
 
{    

    var treeObj = jQuery("#<%=stv1.ClientID %>");       

    var anchorObjList = treeObj.find("a");      

    anchorObjList.click( function()
 
    {  

        anchorObjList.filter(".selectStyle").removeClass("selectStyle");
 
        anchorObjList.filter(".ctl00_ContentPlaceHolder1_stv1_0.ctl00_ContentPlaceHolder1_stv1_1.ctl00_ContentPlaceHolder1_stv1_5").removeClass("ctl00_ContentPlaceHolder1_stv1_0 ctl00_ContentPlaceHolder1_stv1_1 ctl00_ContentPlaceHolder1_stv1_5");
 
        jQuery(this).addClass("selectStyle");
 
    });
 
});
 
测试4：两种表达的不同：
 
控件： 无
 
脚本：jQuery(function($) {});
 
function aa(){}
 


区别在于：第一种当DOM加载完成后，执行其中的函数。第二个function aa()需要在页面中调用