JavaScript Tutorial/jQuery/get — различия между версиями

Материал из Web эксперт
Перейти к: навигация, поиск
 
м (1 версия)
 
(нет различий)

Текущая версия на 08:25, 26 мая 2010

Get first element in query set

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
           var mappedItems = $("li").map(function (index) {
              var data = $("<li>").text($(this).text()).get(0);
              data = [data,$("<li>").get(0)];
              $(data[0]).append("*");
              return data;
           });
           $("#results").append(mappedItems);
        });
    </script>
  </head>
  <body>
    <body>
      <ul>
        <li>asdf</li>
        <li>asdf</li>
        <li>asdf</li>
      </ul>
      <ul id="results">
      </ul>
  </body>
</html>


Get tag first parent

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
             $("*", document.body).each(function () {
                  var parentTag = $(this).parent().get(0).tagName;
                  alert(parentTag);
                  
             });
        });
    </script>
    <style>
      .y { background:yellow; }
  </style>
  </head>
  <body>
    <body>
       <div><button disabled="disabled">First</button> <span class="selected"></span>
            <span></span>
       </div>
  </body>
</html>


Gives the tag name of the element clicked on.

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("*", document.body).click(function (e) {
              e.stopPropagation();
              var domEl = $(this).get(0);
              $("span:first").text("Clicked on - " + domEl.tagName);
            });
        });
    </script>
  </head>
  <body>
    <body>
        <span></span>
        <p>A</p><div>B</div>
    </body>
</html>


Uses the built-in reverse-method to reverse array

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
                
               alert( $("p").get().reverse() );
        });
    </script>
  </head>
  <body>
    <body>
        <p>A</p><p>B</p>
    </body>
</html>