jquery1.5.1根据元素ID获取元素对象

最新推荐文章于 2021-09-02 18:12:51 发布

转载最新推荐文章于 2021-09-02 18:12:51 发布 · 120 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/feima-lxl/archive/2011/04/01/2002640.html

文章标签：

#xhtml #javascript #ViewUI

本文记录了作者初次尝试使用jQuery库的经历，面对一些意料之外的行为感到困惑，特别是在使用ID选择器时，发现$(#ID名)返回的是数组而非单一元素。通过示例代码展示了如何在实际项目中应用jQuery进行DOM操作。

尽管听说jquery的大名几年了，但是一直没有使用过。这两天想在项目中使用被一些小细节折腾的够呛，看来jquery没有传说中的那么好学。在jquery1.5.1根据ID来获取对象返回的是对应数组，想不通怪不得使用document.getElementById(""ID名"")可以取到单一的对象，使用$("#ID名")却不行，悲剧呀。

View Code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title> 选择器测试 </title>
  <style type="text/css">
   .txtobj{background-color: #6600FF;}
  </style>
  <script type="text/javascript" src="../jquery-1.5.1.min.js"></script>
  <script language="JavaScript" type="text/javascript">
  $(document).ready(
     function()
     {
        $("input[type='text']")
        .click
        (
           function()
           {
             this.value=$("#lblMsg")[0].innerText;
           }
        )
        .keydown(
        function()
        {
            alert($("#divTest")[0].innerText);
            alert($("#lblMsg")[0].innerHTML);
            alert($("#txtTest")[0].value);
            return false;
        }
        );
     }
  );
  </script>
</head>

<body>
    <table width="400" border="1" cellpadding="0" cellspacing="0">
       <tr>
          <td><span id="lblMsg">0123456789</span></td>
       </tr>
       <tr>
          <td>
             <input type="text" id="txtTest" class="txtobj" value="@#$message test"/>
          </td>
       </tr>
    </table>
    <div id="divTest">ABCDEFGHIJKLMNOPQRSTUVWXYZ</div>
</body>
</html>

转载于:https://www.cnblogs.com/feima-lxl/archive/2011/04/01/2002640.html