Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 18.10.2015, 00:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,434

Сообщение от FINoM
Вот еще один пример древнего API:
спасибо не знал
Ответить с цитированием
  #22 (permalink)  
Старый 18.10.2015, 00:49
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

Сообщение от рони
спасибо не знал
Таких методов, на самом деле, куча.
__________________
"Matreshka is fucking awesome" © чувак с Reddit
Matreshka.js - Три возможности
Ответить с цитированием
  #23 (permalink)  
Старый 19.10.2015, 02:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,434

Сообщение от FINoM
если можно заюзать slice?
можно и так
Array.apply(null,c.querySelectorAll(".search-element"))
Ответить с цитированием
  #24 (permalink)  
Старый 19.10.2015, 12:28
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

Сообщение от рони
можно и так
В IE8 будет ругаться. В идеале, если забить на совместимость, лучше сделать так:
Array.from(c.querySelectorAll('.selector'));
__________________
"Matreshka is fucking awesome" © чувак с Reddit
Matreshka.js - Три возможности
Ответить с цитированием
  #25 (permalink)  
Старый 21.10.2015, 11:24
Аспирант
Отправить личное сообщение для malefikus13 Посмотреть профиль Найти все сообщения от malefikus13
 
Регистрация: 20.07.2015
Сообщений: 64

Сообщение от рони Посмотреть сообщение
Feuerman063,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">

</head>

<body>
<div id="search">
	<div class="search-element">
		<div><a href="..."><img src="..."></a></div>
		<div><a href="...">Вася</a></div>
	</div>
	<div class="search-element">
		<div><a href="..."><img src="..."></a></div>
		<div><a href="...">Аня</a></div>
	</div>
	<div class="search-element">
		<div><a href="..."><img src="..."></a></div>
		<div><a href="...">Вова</a></div>
	</div>
	<div class="search-element">
		<div><a href="..."><img src="..."></a></div>
		<div><a href="...">Боря</a></div>
	</div>
</div>
<script type='text/javascript'>
var c = document.querySelector("#search");
Array.apply(null,c.querySelectorAll(".search-element"))
.sort(function(a, b) {
    a = a.querySelector("div:last-child > a").text;
    b = b.querySelector("div:last-child > a").text;
    return a < b ? -1 : a > b ? 1 : 0
})
.forEach(function(a) {
    c.appendChild(a)
});
</script>
</body>

</html>

вариант на jQuery тут Как упорядочить несколько тегов одновременно
Рони, доброго дня! А вот такой вопрос есть...а можно ли сделать так, чтоб сортировка происходила исходя из классов? Т.е. есть два класса ".negativ" и ".pozitiv". Можно ли сделать так, чтоб сначала вывелись все классы ".pozitiv", а лишь после этого все элементы с классом ".negativ"?
Ответить с цитированием
  #26 (permalink)  
Старый 21.10.2015, 11:48
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,434

malefikus13,
да ... минимальный html сделайте
Ответить с цитированием
  #27 (permalink)  
Старый 21.10.2015, 11:53
Аспирант
Отправить личное сообщение для malefikus13 Посмотреть профиль Найти все сообщения от malefikus13
 
Регистрация: 20.07.2015
Сообщений: 64

Сообщение от рони Посмотреть сообщение
malefikus13,
да ... минимальный html сделайте
К примеру вот так. Сначала чтоб вывелись все class="pozitive", а следом class="negative"
<div id="block">
	<div class="negative">
		<div><b>Вася</b></div>
	</div>
	<div class="pozitive">
		<div><b>Аня</b></div>
	</div>
	<div class="pozitive">
		<div><b>Вова</b></div>
	</div>
	<div class="negative">
		<div><b>Боря</b></div>
	</div>
</div>
Ответить с цитированием
  #28 (permalink)  
Старый 21.10.2015, 12:09
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,434

malefikus13,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .pozitive{
     background-color: #FF0000;
   }
   .negative{
     background-color: #008000;
   }
   .test{
     background-color: #D2691E;
   }
   a{
     color: #FFFF00;
   }

  </style>
</head>

<body>
<div id="block">
    <div class="test">
		<div><b>Пётр</b></div>
	</div>
	<div class="negative">
		<div><b>Вася</b></div>
	</div>
	<div class="pozitive">
		<div><b>Аня</b></div>
	</div>
	<div class="pozitive">
		<div><b>Вова</b></div>
	</div>
	<div class="negative">
		<div><b>Боря</b></div>
	</div>
</div>

<script type='text/javascript'>
var c = document.querySelector("#block");
Array.apply(null,document.querySelectorAll("#block > div"))
.sort(function(a, b) {
    a = a.classList;
    a = a.contains('pozitive') ? -1 : a.contains('negative') ? 0 : 1;
    b = b.classList;
    b = b.contains('pozitive') ? -1 : b.contains('negative') ? 0 : 1;
    return a < b ? -1 : a > b ? 1 : 0
})
.forEach(function(a) {
    c.appendChild(a)
});
</script>
</body>

</html>
Ответить с цитированием
  #29 (permalink)  
Старый 21.10.2015, 12:16
Аспирант
Отправить личное сообщение для malefikus13 Посмотреть профиль Найти все сообщения от malefikus13
 
Регистрация: 20.07.2015
Сообщений: 64

рони, спасибо большое!
Ответить с цитированием
  #30 (permalink)  
Старый 21.10.2015, 12:22
Аспирант
Отправить личное сообщение для malefikus13 Посмотреть профиль Найти все сообщения от malefikus13
 
Регистрация: 20.07.2015
Сообщений: 64

рони,
а не подскажите еще, для общего развития, что по этой теме следует почитать. Очень хочется поглубже данную тему усвоить. Заранее спасибо Вам!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Требуется javascript ninja для небольшой задачи Achilles_sm Работа 7 01.07.2015 18:33
Бесплатный курс JavaScript (18 уроков)  Bokal Учебные материалы 2 16.11.2014 20:20
Как изменить css одного div при наведении на другой с javascript? InkyThousand Общие вопросы Javascript 7 11.11.2014 16:35
javascript вставки в vrml сцены. Передать событие из броузера Proletariy Javascript под браузер 0 10.05.2011 12:26
JavaScript + div = ? obsessioner Оффтопик 9 09.04.2010 13:58