JQuery шпаргалка

Раніше, коли я робив перші кроки у Web-програмуванні, я часто користувався сайтом Евгенія Попова. Там дуже багато корисних готових рішень і статей про те як додати той чи інший функціонал до себе на сайт. Я гадаю ви знайдете щось корисне для себе на цьому порталі. Тексти статей, на цьому сайті, написане з хорошими прикладами і легко читаються. В цілому скажу, що сайт хороший, проте можливо з часом ви "переростете" цей сайт в певних технологіях. 

Також хотів зауважити що на сайті, є дуже корисна JQuery - шпаргалка. Там є аналогічні шпаргалки по CSS, HTML. Але вони для мене не стали настільки корисними, як по JQuery. Рекомендую переглянути і спробувати ті приклади, які там продемонстровані. Найбільш кориснішою, ця шпаргалка буде для людей, які мають загальне уявлення про JQuery але не мають багато досвіду роботи з цим фрейворком або просто періодично їх потрібно пригадати щось по JQuery. Також в нього є невеличкі, безкоштовні відеокурси по HTML та CSS.

Я у свій час, підготував власну шпаргалку і користуюсь нею по сьогодні. Вона мене досить часто виручає. При потребі, я швидко можу глянути ту або іншу функцію чи як писати фільтри які не дуже розповсюджені.

Ось частина цієї шпаргалки для роботи з масивами, строками та таймером по JavaScript:

//-----!!!!!!!!!!!! JavaScript !!!!!!!!!!!!!!!!!-----
//масиви
var array = new Array("1","4","2","3");

array.push("asd"); //додає елемент в кінцеь
var array2 = ["1","4","2","3"];
array.length; 

array.pop();  //видаляє останній елемент
array.unshft("asdf"); //додає елемент в самий початок
array.shuft(); //видаляє перший елемет

array.splice(3,0,"7","8"); //вставить елетмети з позиції 3
array.splice(3,2); //видалить 2 елетмета з позиції 3
array.splice(3,2,"7","8"); //замінить 2 елетмети з позиції 3

array.concat(array2); //обєднання масивів
array.reverse(); //пеервертає масив
array.sort(); //сортуємо масив
array.join("-"); //заміна розділювача

var a = array3[3][2]; //а = 2
array.slice(1,3); //вирізка з масиву від 1 до 3(невключно)
var array3 = new Array("1","3","5",array,"2",array2,"4"); //багатовимірні масиви

//Timer

clearInterval(id); //очистити інтервал
setTimeout(myFunc,4000); //виконає функцію myFunc через 4 с. (1 раз)
var id = setInterval(myFunc, 4000); //виконає функцію myFunc через кожні 4 с.

//строки
var str = "Стрічка тексту.";
str.length; //довжина строки

str.lastIndexOff("тексту"); //Шукає від кінця строки (повертає позицію або -1)
str.toLowerCase(); //приводить строку до верхнього регістру
str.toUpperCase(); //приводить строку до нижнього регістру
str.indexOff ("тексту"); //Шукає від початку строки (повертає позицію або -1)
str.slice(8); //виріж з 8 до кінця

str.match(/\d{3}/); //шукає регулярний вираз в строці (повертає занчення або -1)
str.slice(8,15); //виріж з 8 до 15(невключно)
str.slice(8,15); //виріж з 8 до 15(невключно)
str.charAt(2); // поверне символ в позиції 2
str.charCodeAt(2); // поверне код символа в позиції 2
str.search(/\d{3}/); //шукає регулярний вираз в строці (повертає позицію або -1)

str.replace(/,/g,"."); //заміняє регулярний вираз в строці (повертає занчення або -1)

Для прикладу продемонструю частину яка стосується JQuery селекторів:

//-----!!!!!!!!!!!! JQuery !!!!!!!!!!!!!!!!!-----
jquery("") //функція JQuery 1-й варіант

$(document).ready(function(){ }); //функція яка очікує повного завантаження DOM-дерева
$("") //функція JQuery 2-й варіант
$(this) //вказівник на поточний об'єкт


$('#main_h1'); //вибір по ідентифікатору елементу
//###Створення jQuery вибірки###
$('p'); //вибір по назві тега
$('.maindiv'); //вибір по назві класу

$('#div_for_img > img'); //вибір дочірніх тегів
$('#div_for_img img'); //вибір по вложеним селекторах
$('#main_h1 + p'); //вибір наступного тегу
$('img[width=200]'); //вибір по точному значенню атрибута

$('img[src*=moto]'); //вибірка по входженню значення атрибута
$('a[href^=http]'); //вибірка по початку значення атрибута
$('img[src$=.jpg]'); //вибірка по закінченню значенню атрибута
$('div:visibility'); //фільтр видимих елементів

$('p:contains(мотоцикл)'); //фільтр по змісту тексту
$('div:hidden'); //фільтр не видимих елементів
$('#div_for_img img:last'); //фільтр - лише останній елемент
$('#div_for_img img:first'); //фільтр - лише перший елемент
$('div:has(fieldset)'); //фільтр по вмісту тегів

$('#moto_table tr:even'); //фільтр парних
$('img:not(#div_for_img img)'); //фільтр заперечення. Всі крім

$('#moto_table tr:odd'); //фільтр непарних

Ресурси: JavaScript_JQuery_shpargalka.js