Код пользовательского селектора jQuery - PullRequest
1 голос
/ 13 января 2012

Я изучаю jQuery, пока читаю книгу, есть код, где вы делаете пользовательский селектор. Вот код

(function($) {
    $.extend($.expr[':'], {
        group: function(element, index, matches, set) {
            var num = parseInt(matches[3], 10);
            if (isNaN(num)) {
                return false;
            }
            return index % (num * 2) < num;
        }
    });
})(jQuery);

и вот он зовет

$(document).ready(function() {
    function stripe() {
        $('#news').find('tr.alt').removeClass('alt');
        $('#news tbody').each(function() {
            $(this).children(':visible').has('td')
                .filter(':group(3)').addClass('alt');
        });
    }

    stripe();

});

Я знаю, что .filter () запускается для каждого подэлемента. Предположим, что если мой элемент tbody имеет 4 tr (строки), то .filter запускается для каждой tr (неявная итерация). Теперь, когда вызывается .filter (': group (3)'), то я замечаю, что параметры, которые передаются функции: group:

Впервые стало

группа: функция (элемент, индекс, совпадения, набор)

элемент равен tr , индекс равен 0 , mathces становится [": group (3)", "group", "", "3"] и set становятся [tr, tr, tr, tr, tr]

Теперь я понимаю, что у каждого тега tbody есть номер tr, который становится массивом набора. Но, пожалуйста, также скажите мне, как работает parseInt (match [3], 10)?

Я хочу спросить, как jQuery сделал массив совпадений. Я просто пишу: группа (3). Как соотносится значение с этими значениями в списке параметров?

Вот фрагмент кода HTML

<table id="news">
    <thead>
        <tr>
            <th>Date</th>
            <th>Headline</th>
            <th>Author</th>
            <th>Topic</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <th colspan="4">2011</th>
        </tr>
        <tr>
            <td>Apr 15</td>
            <td>jQuery 1.6 Beta 1 Released</td>
            <td>John Resig</td>
            <td>Releases</td>
        </tr>
        <tr>
            <td>Feb 24</td>
            <td>jQuery Conference 2011: San Francisco Bay Area</td>
            <td>Ralph Whitbeck</td>
            <td>Conferences</td>
        </tr>
        <tr>
            <td>Feb 7</td>
            <td>New Releases, Videos &amp; a Sneak Peek at the jQuery UI Grid</td>
            <td>Addy Osmani</td>
            <td>Plugins</td>
        </tr>
        <tr>
            <td>Jan 31</td>
            <td id="release">jQuery 1.5 Released</td>
            <td>John Resig</td>
            <td>Releases</td>
        </tr>
        <tr>
            <td>Jan 30</td>
            <td>API Documentation Changes</td>
            <td>Karl Swedberg</td>
            <td>Documentation</td>
        </tr>
    </tbody>

    <tbody>
        <tr>
            <th colspan="4">2010</th>
        </tr>
        <tr>
            <td>Nov 23</td>
            <td>Team Spotlight: The jQuery Bug Triage Team</td>
            <td>Paul Irish</td>
            <td>Community</td>
        </tr>
        <tr>
            <td>Oct 4</td>
            <td>New Official jQuery Plugins Provide Templating, Data Linking and Globalization</td>
            <td>John Resig</td>
            <td>Plugins</td>
         </tr>
         <tr>
             <td>Sep 4</td>
             <td>The Official jQuery Podcast Has a New Home</td>
             <td>Ralph Whitbeck</td>
             <td>Documentation</td>
         </tr>
         <tr>
             <td>Aug 24</td>
             <td>jQuery Conference 2010: Boston</td>
             <td>Ralph Whitbeck</td>
             <td>Conferences</td>
         </tr>
         <tr>
             <td>Aug 13</td>
             <td>The jQuery Project is Proud to Announce the jQuery Mobile Project</td>
             <td>Ralph Whitbeck</td>
             <td>Plugins</td>
         </tr>
         <tr>
             <td>Jun 14</td>
             <td>Seattle jQuery Open Space and Hack Attack with John Resig</td>
             <td>Rey Bango</td>
             <td>Conferences</td>
         </tr>
         <tr>
             <td>Mar 16</td>
             <td>Microsoft to Expand its Collaboration with the jQuery Community</td>
             <td>John Resig</td>
             <td>Miscellaneous</td>
         </tr>
         <tr>
             <td>Mar 15</td>
             <td>jQuery Conference 2010: San Francisco Bay Area</td>
             <td>Mike Hostetler</td>
             <td>Conferences</td>
         </tr>
         <tr>
             <td>Jan 14</td>
             <td>jQuery 1.4 Released</td>
             <td>John Resig</td>
             <td>Releases</td>
         </tr>
         <tr>
             <td>Jan 8</td>
             <td>14 Days of jQuery and the New API Browser</td>
             <td>John Resig</td>
             <td>Documentation</td>
         </tr>
     </tbody>

     <tbody>
         <tr>
             <th colspan="4">2005</th>
         </tr>
         <tr>
             <td>Dec 17</td>
             <td>JSON and RSS</td>
             <td>John Resig</td>
             <td>Documentation</td>
         </tr>
         <tr>
             <td>Dec 14</td>
             <td>Google Homepage API</td>
             <td>John Resig</td>
             <td>Miscellaneous</td>
         </tr>
         <tr>
             <td>Dec 13</td>
             <td>XPath and CSS Selectors</td>
             <td>John Resig</td>
             <td>Miscellaneous</td>
         </tr>
         <tr>
             <td>Dec 12</td>
             <td>Sparklines with JavaScript and Canvas</td>
             <td>John Resig</td>
             <td>Miscellaneous</td>
         </tr>
     </tbody>

 </table>

Спасибо

1 Ответ

1 голос
/ 13 января 2012

В вашем примере, matches[3] == "3".Таким образом, parseInt(matches[3], 10); преобразует «3» в целое число 3 (основание 10 = десятичное число).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...