Форум

cha0s · #1 (**permalink**) 26.02.2014, 16:41

Есть такой hml код

<table>
	<tbody>
		<tr>
			<td>description</td>
		</tr>
		<tr>
			<td>
			<table class="spec">
				<tbody>
					<tr>
						<td>CPU Family name</td>
						<td>Athlon X2</td>
					</tr>
					<tr>
						<td>Model number</td>
						<td>340</td>
					</tr>
					<tr>
						<td>Clock speed</td>
						<td>3200 MHz</td>
					</tr>
					<tr>
						<td>Cache</td>
						<td>1MB</td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
	</tbody>
</table>

как с помощью jquery пробежать его и прописать нужным <td> классы... Например мне надо чтоб этот html стал таким

<table>
	<tbody>
		<tr>
			<td class="desc">description</td>
		</tr>
		<tr>
			<td>
			<table class="spec">
				<tbody>
					<tr>
						<td class="left">CPU Family name</td>
						<td class="right">Athlon X2</td>
					</tr>
					<tr>
						<td class="left">Model number</td>
						<td class="right">340</td>
					</tr>
					<tr>
						<td class="left">Clock speed</td>
						<td class="right">3200 MHz</td>
					</tr>
					<tr>
						<td class="left">Cache</td>
						<td class="right">1MB</td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
	</tbody>
</table>

Количество строк в таблице с классом spec может быть сколько угодно

ksa · #2 (**permalink**) 26.02.2014, 19:11

Сообщение от cha0s

как с помощью jquery пробежать его и прописать нужным <td> классы...

Дык бегать и не нужно... Можно простым цсс-селектором обойтись...
Вот, если уш так приперло...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.left {
	color: green;
}
.right {
	color: blue;
}
</style>
<script type="text/javascript">
$(function (){
	$('.spec td:first-child').addClass('left');
	$('.spec td:last-child').addClass('right');
});
</script>
</head>
<body>
<table>
	<tbody>
		<tr>
			<td>description</td>
		</tr>
		<tr>
			<td>
			<table class="spec">
				<tbody>
					<tr>
						<td>CPU Family name</td>
						<td>Athlon X2</td>
					</tr>
					<tr>
						<td>Model number</td>
						<td>340</td>
					</tr>
					<tr>
						<td>Clock speed</td>
						<td>3200 MHz</td>
					</tr>
					<tr>
						<td>Cache</td>
						<td>1MB</td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
	</tbody>
</table>
</body>
</html>

рони · #3 (**permalink**) 26.02.2014, 19:14

cha0s,
а нафига прописывать классы когда можно задать css чётным и нечётным ячейкам

danik.js · #4 (**permalink**) 27.02.2014, 07:54

ksa, выходит, ты юзаешь те же css-селекторы, только используя еще js, причем библиотеку на 30 000 строк. Вопрос: нахуя??

Хотя больше вопрос касается cha0s'а

ksa · #5 (**permalink**) 27.02.2014, 08:40

Сообщение от danik.js

выходит, ты юзаешь те же css-селекторы, только используя еще js

Так я так специально сделал, дабы показать те селекторы.

Форум

Справочник

Discord чат

Курсы javascript