Актуални технологии, достъпни чрез JavaScript

автор: Мариан Костадинов

В началото

if (document.all) { //стотина реда код ... } else if (document.getElementById) { //още стотина реда код ... } <button onclick="top.opener.frames[2].src = 'index.html';">бутон</button> <body onload="init()"> ... <script language="JavaScript"> function init() { ... } </script> ... </body>

В последните години

Prototype:
$('element-id').addClass ('some-class') new Ajax.Request('/ajax.php', { method:'get' });
jQuery:
$.ajax('/ajax.php') $(document.ready(function() { ... $('#element-id').click(...).addClass('abc').fade(); ... }));

Съвременни браузъри

CSS:
div { width: 300px; transition: width 1s ease-in; } div:hover { width: 450px; } input:checked + label { animation: blink; } @keyframes blink { from { opacity: 1 } 50% { opacity: 0; } to { opacity: 1; } } textarea:invalid { border: red; }

Съвременни браузъри

HTML 5:
<details> <summary>open form</summary> <form> <input name="title" required /> <input type="email" /> <input type="submit" /> </form> </details>
Демо

Съвременни браузъри

localStorage.setItem ('visits', (localStorage.getItem ('visits') || 0) + 1); var link = document.querySelector ('a.link'); link.classList.add ('special'); link.dataset.value = 5; var source = new EventSource('event_source.php'); source.onmessage = function (message) { console.log(message.data); }; var connection = new WebSocket('ws://socket-server.com/echo', ['xmpp']); connection.onopen = function() { connection.send('Hello') }; connection.onmessage = function (message) { console.log(message.data); }; var worker = new Worker('work.js'); worker.postMessage('start'); navigator.getUserMedia('video', successCallback, errorCallback); window.onhashchange = function() { console.log ('new hash = ', location.hash); }; var jsValue = JSON.parse (text); var encodedValue = JSON.stringify (jsValue); requestAnimationFrame(function() { ... }, element); var notification = new Notification("Hello");

Време е за демонстрация...

Вашите въпроси

Благодаря

22 Април 2013г.