zoukankan      html  css  js  c++  java
  • JQuery 遍历

    目录

    1 DOM对象的遍历

    2 数组的遍历

    3 对象的遍历

    json 对象

    input对象text check

    option对象select

    一、dom对象的遍历

    <%@ page language="java" pageEncoding="UTF-8"%>
    <html>
      <head>
        <title>My JSP 'index.jsp' starting page</title>
      </head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
    </head>
        <body>
        <p>a</p>
        <p>b</p>
        <p>c</p>
        <p>d</p>
        </body>
        <script type="text/javascript">    
        $.each($('p'), function() {
            alert($(this).html());
          });</script>
    </html>

    二、数组的遍历

    <script type="text/javascript">var arr = [ 1, 2, 3, 4, 5 ]    
        $.each(arr, function(i, n) {
            alert(i + " " + n);
        });</script>

    三、对象的遍历

    <script type="text/javascript">    
        var names= {A : "a" ,B : "b"};
        $.each(names, function(i, n) {
            alert( i + " " + n);
        });
    </script>

    option对象的遍历

    <%@ page language="java" pageEncoding="UTF-8"%>
    <html>
      <head>
        <title>My JSP 'index.jsp' starting page</title>
      </head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
    </head>
        <body>
        <select name="test">
         <option value="AAA">aaa</option>
         <option value="BBB">bbb</option>
         </select > 
         <select name="test2">
         <option value="EEE">eee</option>
         <option value="FFF">fff</option>
         </select > 
       <input type="button" id="but1" value="click me">
        <input type="button" id="but2" value="click me">
        </body>
    <script type="text/javascript">    
        $('#but1').click(function(){
             var $obj1 = $("[name=test] option:selected");
          $.each($obj1, function(i, n) {
            alert($(n).val());
        });
        });
          $('#but2').click(function(){
            var $obj2 = $("select option:selected");
          $.each($obj2, function(i, n) {
            alert($(n).val());
        });
        });
    </script>
    </html>

    input对象的遍历

    checkbox

    <%@ page language="java" pageEncoding="UTF-8"%>
    <html>
      <head>
        <title>My JSP 'index.jsp' starting page</title>
      </head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
    </head>
        <body>
        <input type="checkbox" value="AA"/>aa
        <input type="checkbox" value="BB"/>bb
        <input type="checkbox" value="CC"/>cc
       <input type="button" id="but1" value="click me">
        </body>
    <script type="text/javascript">    
        $('#but1').click(function(){
             var $obj1 = $("input[type='checkbox']:checked");
          $.each($obj1, function(i, n) {
            alert($(n).val());
        });
        });
    </script>
    </html>

    text

    <%@ page language="java" pageEncoding="UTF-8"%>
    <html>
      <head>
        <title>My JSP 'index.jsp' starting page</title>
      </head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
    </head>
        <body>
        <input type="text" value="AA"/>
        <input type="text" value="BB"/>
        <input type="checkbox" value="CC"/>
       <input type="button" id="but1" value="click me">
        </body>
    <script type="text/javascript">    
        $('#but1').click(function(){
             var $obj1 = $("input[type='text']");
          $.each($obj1, function(i, n) {
            alert($(n).val());
        });
        });
    </script>
    </html>
  • 相关阅读:
    TypeScript完全解读(26课时)_7.ES6精讲
    Flutter实战视频-移动电商-66.会员中心_编写ListTile通用方法
    Residual Networks &lt;2015 ICCV, ImageNet 图像分类Top1&gt;
    Coursera《machine learning》--(14)数据降维
    C# webbrowser遍历网页元素
    查询某表空间被哪些用户所使用
    C 语言运算符优先级(记忆口诀)
    建立简单的哈希表
    【LeetCode-面试算法经典-Java实现】【168-Excel Sheet Column Title(Excell列标题)】
    计算随意无序字符串中的最大有序串
  • 原文地址:https://www.cnblogs.com/sunfan1988/p/3516466.html
Copyright © 2011-2022 走看看