XML-разбор Jquery - цвет чередующихся строк - PullRequest
Новая
       20

XML-разбор Jquery - цвет чередующихся строк

0 голосов
/ 06 апреля 2011

Как добавить код к следующему, чтобы чередовать цвет строки 

parsedata = function(xml){        
            var str = "";
            var cart = xml.documentElement.firstChild;
            if(cart.childNodes.length > 0 ){                
                str = str + '<table border="0" width="100%" cellspacing="0" cellpadding="5">';
                str = str + '  <tr><td class="animBoxCartLink" colspan="2"><a href="' + globals.cart_link + '">' + globals.cart_text + '</a></td></tr>
                for (var i = 0; i < cart.childNodes.length; i++){               
                    try{name =  cart.getElementsByTagName("NAME")[i].childNodes[0].nodeValue;}catch(e){name = "Item";}
                    try{attributes =  cart.getElementsByTagName("ATTRIBUTES")[i].childNodes[0].nodeValue;}catch(e){attributes = "";}
                    try{llink =  cart.getElementsByTagName("LINK")[i].childNodes[0].nodeValue;}catch(e){llink = "";}
                    try{image =  cart.getElementsByTagName("IMAGE")[i].childNodes[0].nodeValue;}catch(e){image = "No Image";}
                    try{qty =  cart.getElementsByTagName("QTY")[i].childNodes[0].nodeValue;}catch(e){qty = "message";}
                    try{price =  cart.getElementsByTagName("PRICE")[i].childNodes[0].nodeValue;}catch(e){price = "$0.00";}

                    dimension = (globals.cart_image_width ? 'width="' + globals.cart_image_width : '') + (globals.cart_image_height ? '" height="' + globals.cart_image_height + '"' : '');

                str = str + '  <tr>';
                str = str + '    <td class="animBoxCartImage" width="' + globals.cart_image_width + '" align="center"><a href="' + llink +'"><img src="' + image + '" ' + dimension + ' border="0" alt="' + name + '"></a></td>';
                str = str + '    <td class="animBoxCartContent" width="100%">';
                str = str + '      <div class="animBoxCartName"><a href="' + llink + '">' + name + '</a><br />' + attributes + '</div>';
                str = str + '      ' + globals.text_cart_quantity + ' ' + qty;
                str = str + '      <div class="animBoxCartPrice">' + price + '</a></div>';
                str = str + '      <a href="' + llink + '"> More Info </a>';
                str = str + '    </td>';
                str = str + '  </tr>';

Первая половина файла .js (Jquery) в основном относится к отображению / скрытию корзины, которая расположеная думаю, что заголовок и часть, которую я только что опубликовал, - это то, где мне нужно было бы добавить код, где я мог бы добавлять стили, чтобы чередовался цвет строки.

Ответы [ 2 ]

1 голос
/ 06 апреля 2011

Сохраняя остальную часть вашего кода тем же:

Замените str = str + ' <tr>'; на: 

str = str + '  <tr class="rowcolor' + (i%2) + '">';

Затем вам понадобятся классы CSS, определенные для цветов строк: 

.rowcolor0 {
    background-color: #ffffff;
}

.rowcolor1 {
    background-color: #dddddd;
}
0 голосов
/ 06 апреля 2011

Я даже не собираюсь пытаться это исправить. На tr: 

str += '  <tr>';

добавить альтернативный класс строки: 

str += '  <tr class="' + i%2 == 0 ? 'altrow' : '' + '">';
...