jQuery入门

来源：互联网发布：非法集资判定知不知情编辑：程序博客网时间：2024/05/17 00:00

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>form.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">    <script language="JavaScript" src="./js/jquery-1.4.2.js"></script>  </head>  <body>       <input type="text" value="zhang" id="username" name="username" />  </body>  <script language="JavaScript">    //测试    //使用document输出//  var username = document.getElementById("username");//  //  alert(username.value);    //使用JQuery输出    /*     * jquery对象：需要用"$"来修饰     *      * jquery获取页面标签：$()来包裹，通过"#id"来获取     *      */    var $username = $("#username");//document.getElementById("username");    alert($username.val()); ////username.value  </script></html>

dom转化为JQUery对象

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>form.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">    <script language="JavaScript" src="./js/jquery-1.4.2.js"></script>  </head>  <body>     <input type="text" value="zhang" id="username" name="username" />  </body>  <script language="JavaScript">  //dom转化为JQUery对象  $(DOM对象)  var username = document.getElementById("username");  var $username = $(username);  alert($username.val());  </script></html>

JQUERY对象转化为DOM对象

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>form.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">    <script language="JavaScript" src="./js/jquery-1.4.2.js"></script>  </head>  <body>     <input type="text" value="zhangxx" id="username" name="username" />     <input type="text" value="zhangsanfeng" id="username1" name="username" />  </body>  <script language="JavaScript">   //JQUERY对象转化为DOM对象      //方法一：jquery对象是一个数组对象，获取利用索引值进行转换成DOM对象      var $username = $("#username");//    var username = $username[0];//    //    alert(username.value);      //方法二：在jquery中，提供了一个get(index)方法，get()中传入索引值，来进行转换成DOM对象       var username = $username.get(0);       alert(username.value);  </script></html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>form.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">    <script language="JavaScript" src="./js/jquery-1.4.2.js"></script>  </head>  <body>     <input type="text" value="zhang" id="username1" name="username1" />     <input type="text" value="88888" id="psw" name="psw" />  </body>  <script language="JavaScript">            //dom，提示：缺少对象，需要手动判断 //      var username = document.getElementById("username");//      if(!username){//          alert("id不存在");//      }else{//          alert(username.value);//      }        //jquery，有相对完善的对事件处理的机制        var $username = $("#username111");        alert($username.val());  </script></html>

0 0