Как запустить скрипт по нажатию кнопки?

Question

[Anton-Pluton]

function sortable(cls, attr) {
var elements = document.querySelectorAll(cls),
len = elements.length,
parent = document.querySelector('.posts-rub'),
arrElements = [];
for(var i = 0; i < len; i++) {
arrElements.push({
dataAttr : elements[i].getAttribute(attr),
el: elements[i]
});
}
arrElements.sort(function(a, b){
return parseInt(a.dataAttr) > parseInt(b.dataAttr) ? 1 : -1;
});
for(var j = 0; j < len; j++) {
parent.appendChild(arrElements[j].el);
}
}
sortable('.cards', 'data-views');

Answer 1

[Илья Канышев]

Допустим у нас есть кнопочка с Id="LOL"

<button id="lol">
  LOL
</button>

Тогда для этой функции будет

document.getElementById("lol").onclick = sortable ()

И соответственно передаваемые параметры

Comments

[Anton-Pluton]

Спасибо вам за помощь но не могли бы вы показать куда и как именно вот этот "кусок" вставить .
document.getElementById("lol").onclick = sortable ()
Просто еще новичек в Java Script .

[Илья Канышев]

Anton-Pluton, что вы новичок, я сразу понял. Вставлять JavaScript код необходимо либо в конце HTML-страницы, либо в начале в window.onload так:

window.onload = function() {
//your code
}

[Anton-Pluton]

Илья Канышев, window.onload = function() {
function sortable(cls, attr) {
var elements = document.querySelectorAll(cls),
len = elements.length,
parent = document.querySelector('.posts-rub'),
arrElements = [];
for(var i = 0; i < len; i++) {
arrElements.push({
dataAttr : elements[i].getAttribute(attr),
el: elements[i]
});
}
arrElements.sort(function(a, b){
return parseInt(a.dataAttr) > parseInt(b.dataAttr) ? 1 : -1;
});
for(var j = 0; j < len; j++) {
parent.appendChild(arrElements[j].el);
}
}
sortable('.cards', 'data-views');
document.getElementById("lol").onclick = sortable ()
}

Получился вот такой вот код но кнопка все равно не работает . Сортировка происходит при открытии страницы

[Илья Канышев]

Anton-Pluton, Вы не передали необходимые параметры функции

function sortable(cls, attr) {
var elements = document.querySelectorAll(cls),
len = elements.length,
parent = document.querySelector('.posts-rub'),
arrElements = [];
for(var i = 0; i < len; i++) {
arrElements.push({
dataAttr : elements[i].getAttribute(attr),
el: elements[i]
});
}
arrElements.sort(function(a, b){
return parseInt(a.dataAttr) > parseInt(b.dataAttr) ? 1 : -1;
});
for(var j = 0; j < len; j++) {
parent.appendChild(arrElements[j].el);
}
}
sortable('.cards', 'data-views');	
}
window.onliad = function() {
document.getElementById("lol").onclick = sortable (/* Здесь параметры*/)
}

[Anton-Pluton]

Илья Канышев, спасибо вам за помощь
большое

[Anton-Pluton]

Илья Канышев, но еще последний вопрос . Какие параметры надо записать сюда что бы скрипт выводил значение от меньшего к большему ? Помогите пожалуйста !

[Илья Канышев]

Anton-Pluton, необходимо знать что вы хотите отсортировать (HTML-код).

[Anton-Pluton]

Илья Канышев,


Контент


В data-views пишется значение которое нужно отсортировать по возврастанию .

[Anton-Pluton]

Илья Канышев,

<div class="cards" data-views="1400">
         <div class="pod_prod_4">
                Контент
          </div>
</div>

В data-views пишется значение которое нужно отсортировать по возврастанию .