Быстрая разработка веб-интерфейсов на JavaScript

Нажмите для полного просмотра!

Быстрая разработка веб-интерфейсов на JavaScript, слайд №2

Быстрая разработка веб-интерфейсов на JavaScript, слайд №3

Быстрая разработка веб-интерфейсов на JavaScript, слайд №4

Быстрая разработка веб-интерфейсов на JavaScript, слайд №5

Быстрая разработка веб-интерфейсов на JavaScript, слайд №6

Быстрая разработка веб-интерфейсов на JavaScript, слайд №7

Быстрая разработка веб-интерфейсов на JavaScript, слайд №8

Быстрая разработка веб-интерфейсов на JavaScript, слайд №9

Быстрая разработка веб-интерфейсов на JavaScript, слайд №10

Быстрая разработка веб-интерфейсов на JavaScript, слайд №11

Быстрая разработка веб-интерфейсов на JavaScript, слайд №12

Быстрая разработка веб-интерфейсов на JavaScript, слайд №13

Быстрая разработка веб-интерфейсов на JavaScript, слайд №14

Быстрая разработка веб-интерфейсов на JavaScript, слайд №15

Быстрая разработка веб-интерфейсов на JavaScript, слайд №16

Быстрая разработка веб-интерфейсов на JavaScript, слайд №17

Быстрая разработка веб-интерфейсов на JavaScript, слайд №18

Быстрая разработка веб-интерфейсов на JavaScript, слайд №19

Быстрая разработка веб-интерфейсов на JavaScript, слайд №20

Быстрая разработка веб-интерфейсов на JavaScript, слайд №21

Быстрая разработка веб-интерфейсов на JavaScript, слайд №22

Быстрая разработка веб-интерфейсов на JavaScript, слайд №23

Содержание ▲

Вы можете ознакомиться и скачать Быстрая разработка веб-интерфейсов на JavaScript. Презентация содержит 23 слайдов. Презентации для любого класса можно скачать бесплатно. Если материал и наш сайт презентаций Вам понравились – поделитесь им с друзьями с помощью социальных кнопок и добавьте в закладки в своем браузере.

Слайды и текст этой презентации

Слайд 1

Описание слайда:

Быстрая разработка веб-интерфейсов на JavaScript

Слайд 2

Описание слайда:

Зачем это и с чего всё началось? Сложность непосредственной работы с DOM Избыточность классического JS-кода Кроссбраузерность

Слайд 3

Описание слайда:

Holly Wars Prototype/Scriptaculous (> 200Kb) Mootools Dojo

Слайд 4

Описание слайда:

jQuery

Слайд 5

Описание слайда:

$ $(селектор, [контекст]) $(HTML) $(document | window | form) $(function)

Слайд 6

Описание слайда:

$(document).ready() <sctipt type=“text/javascript”> window.onload = myOnloadHandler; </script>

Слайд 7

Описание слайда:

Селекторы #id tag .class * selector1, selector2, …, selectorN

Слайд 8

Описание слайда:

[Селектор] :фильтр

Слайд 9

Описание слайда:

Ещё раз о $ eq( index ) filter ( выражение | function ) slice ( from, [to] ) get( index ) length

Слайд 10

Описание слайда:

Цепные вызовы — chaining $(“div”). children(). hide(). end() . addClass(“c”);

Слайд 11

Описание слайда:

Долой унылые методы манипуляции с DOM! html ( ) html ( val ) text ( ) text ( val ) append ( content ) appendTo ( selector ) prepend ( content ) prependTo ( selector ) after ( content ) before ( content ) insertAfter ( content ) insertBefore ( content ) replaceWith ( content ) replaceAll ( selector ) empty ( ) remove ( expr ) wrap ( html | elem ) wrapAll ( html | elem ) wrapInner ( html | elem ) clone ( [true] )

Слайд 12

Описание слайда:

Слайд 13

Описание слайда:

События bind( type, data, fn ) one( type, data, fn ) trigger( type, data ) triggerHandler( type, data ) unbind( type, fn )

Слайд 14

Описание слайда:

События → плюшки! hover ( over, out ) toggle ( [fn1, fn2, …, fnN] ) click ( [fn] ) dbclick ( [fn] ) resize ( fn ) mouseover ( fn ) keypress ( [fn] )

Слайд 15

Описание слайда:

События → preventDefault $(“a”). click ( myClickHandler ); function myClickHandler ( event ) { // Перехода по ссылке не будет event.preventDefault(); $( this ) . hide(); }

Слайд 16

Описание слайда:

$.ajax();

Слайд 17

Описание слайда:

АЙ-АЙ $.ajax ( { } ) .load ( url, [data], [callback]) $.get ( url, [data], [callback], [type]) $.getJSON( url, [data], [callback]) $.post( url, [data], [callback], [type]) + события ajaxError ( callback )

Слайд 18

Описание слайда:

Эффекты и анимация show / hide ( [speed], [callback] ) toggle () slideUp /slideDown /slideToggle (speed, [clbk]) fadeIn / fadeOut(s, [cb]) / fadeTo(s, o, [cb]) animate() stop() queue() / dequeue()