Архив рубрики: JavaScript

Полезные скрипты JavaScript

Несколько полезных скриптов.
Повесить обработчики на фрейме.
function Addhandler() { var input = window.frames['mainFrame'].document.getElementById('Lastname'); if (input == null) { return; } else { var inputs = window.frames['mainFrame'].document.getElementsByTagName('input'); } if (undefined !== inputs && inputs.length) { for (index = 0; index < inputs.length; ++index) { var input = inputs[index]; input.onkeyup = function (e) { var item; var itext = ''; itext = this.value.replace(' ', ''); itext = itext.replace('ё', 'е'); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(' ', ''); item = item.replace('ё', 'е'); if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } } } } }

JavaScript, добавить обработчик на элемент
function Addhandler() { var inputs = document.getElementsByTagName(«input»); for (index = 0; index < inputs.length; ++index) { var input = inputs[index]; input.onkeyup = function (e) { var item; var itext = «»; itext = this.value.replace(» «, «»); itext = itext.replace(«ё», «е»); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(» «, «»); item = item.replace(«ё», «е»); if (itext.toLowerCase() == item.toLowerCase()) { alert(alert('Вы угадали секретное слово ' + itext + ' поздравляем');  } } } }; }
Jquery, можно определить больше одного обработчика
function Addhandler() { $(document).ready(function () { $('input').each(function () { var element = $(this); var j = 0; var DomElement = element.get(0); var ev = $._data(DomElement, 'events'); if (ev != undefined && ev.keyup != undefined) { j = 1; } else { $(this).bind(«keyup«, function (e) { var item; var itext = «»; itext = this.value.replace(» «, «»); itext = itext.replace(«ё», «е»); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(» «, «»); item = item.replace(«ё», «е»); if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } }); } }) }) }
Провер
ка ввода, должен работать с 9 версии IE
function Addhandler() { var newDiv = document.createElement('span');newDiv.className = 'myclass';newDiv.id = 'statemsg';newDiv.style.backgroundColor = 'red';document.body.appendChild(newDiv);var msg = document.getElementById('statemsg');document.body.addEventListener('keydown', function (e) {msg.textContent = 'keydown:' + e.keyCode;});document.body.addEventListener('keyup', function (e) {msg.textContent = 'keyup:' + e.keyCode;});document.body.addEventListener('keypress', function (e) {msg.textContent += 'keypress:' + e.keyCode;});}
Проверка клавиш для окна должен работать с 9 версии IE
function Addhandler() {document.body.addEventListener('keyup', function (e){var el = document.activeElement;var itext = «»;var item;if (el && (el.tagName.toLowerCase() == 'input' && el.type == 'text' ||el.tagName.toLowerCase() == 'textarea')) {itext = el.value.trim(); itext = itext.replace('ё', 'е');var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) {item = items[i].replace(' ', '');item = item.replace('ё', 'е');if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } }  });  }

Автор: Roman D
Дата публикации: 2016-04-13T07:53:00.001-07:00

Селекторы JQuery

Селекторы jQuery

Для изучения используйте jQuery Selector Tester
elements elements

Автор: Roman D
Дата публикации: 2016-04-01T01:51:00.000-07:00

Выполняем тестовое задание на вакансию "Стажёр-разработчик на JavaScript"

За неделю прочитал развлекательное чтиво на 640 страниц: Изучаем программирование на JavaScript, чтобы как-то понять как сделать тестовое задание на позицию Стажёр-разработчик на JavaScript

Скажу честно, вбивал себе в голову принципы JavaScript с особым усердием, но за неделю, конечно, этот язык программирования не узнать, но отвел себе неделю на чтение литературы и неделю на разработку. Но что-то из книги понял…

Попробую сегодня (26.09.2015) начать делать задание.

Техническое задание: Сортировщик карточек путешественников.

Условие:
Вам дана стопка посадочных карточек на различные виды транспорта, которые доставят вас из точки A в точку B. Карточки перепутаны, и вы не знаете, где начинается и где заканчивается ваше путешествие. Каждая карточка содержит информацию о том, откуда и куда вы едете на данном отрезке маршрута, а также о типе транспорта (номер рейса, номер места и прочее).

Предоставьте JavaScript API, который отсортирует такой список карточек и вернет словесное описание, как проделать ваше путешествие. API должен принимать на вход несортированный список карточек в формате придуманном вами и возвращать, например, такое описание:

  • Take train 78A from Madrid to Barcelona. Seat 45B.
  • Take the airport bus from Barcelona to Gerona Airport. No seat assignment.
  • From Gerona Airport, take flight SK455 to Stockholm. Gate 45B. Seat 3A. Baggage drop at ticket counter 344.
  • From Stockholm, take flight SK22 to New York JFK. Gate 22. Seat 7B. Baggage will be automatically transferred from your last leg.

Требования:

  • Алгоритм должен работать с любым количеством карточек, если все карточки образуют одну неразрывную цепочку.
  • Время прибытия и отправления неизвестно и не важно. Подразумевается, что средство передвижения для следующего отрезка дожидается вас.  вычеркнул, чтобы не отвлекало, нас это на данный момент не интересует.
  • Структура кода должна быть расширяема для использования любых типов транспорта и информации, которая может быть связана с каждым типом транспорта.
  • API будет вызываться из других частей JavaScript-кода без необходимости дополнительных запросов между браузером и сервером.
  • Не используйте библиотеки и фреймворки, напишите все с нуля.
  • Задокументируйте в коде формат входных и выходных данных. 

 РЕШЕНИЕ

На самом деле это не решение, а мысли вслух, т.е. переложу то что понял из книги на решение поставленной задачи.
  1. У нас есть карточки путешественников. Это некий объект информации, в котором заключена следующая информация: Пункт отправления (А), Пункт назначения (B), способ передвижения, дополнительная информация (чисто разбавить сухой текст)
  2. Мы должны сортировать ПО ПОРЯДКУ пунктов отправления и назначения. Например: A1-B1(A2)-B2(A3)-B3 и так далее.
  3. Есть несколько способов передвижения: Ноги, Машина, Городской транспорт, Поезда, Самолеты, Параходы и так далее — нужно чтобы была возможность расширять перечень
  4. У каждого способа передвижения своя специфика на каждый вид транспорта
  5. Метод сортировки по массиву объектов An и Bn.
Какие у меня будут объекты?
Города
Способы передвижения

Какие у меня будут функции?
Сортировка

Черновой вариант сортировки и вывода 

Автор: Ilya Druzhinin
Дата публикации: 2015-09-26T06:12:00.001-07:00

Тестируем JavaScript в Blogger'e

Начал читать книгу Изучаем программирование на JavaScript из серии Head First O'Reilly. Манера подачи очень легкая и простая, собственно так и задумывалось. Там даже есть рассказ почему выбрали именно такой подход.

Так вот. Если вы знакомы с основными конструкциями языка Си, то понять JavaScript будет не сложно. Достаточно легкий язык для изучения, хотя я только второй день с ним знаком, могу и ошибаться, т.к. ещё многого про него не знаю. Но всё впереди.

Зачем мне нужен JavaScript? 
Для того чтобы через 2 недели отправить в Яндекс тестовое задание и устроится туда стажером и нарабатывать практику в программировании. Поэтому я сейчас сконцентрировал все свои ментальные силы на постижение и изучение JavaScript. Да и в целом, знание этого языка будет мне плюсом в устройство в Google Zurich. Там в вакансиях есть такое требование: Proficient in front end development, has deep knowledge in JavaScript advanced features; familiar with browsers' compatibility.

 

—————————
Генератор случайных фраз
—————————

Автор: Ilya Druzhinin
Дата публикации: 2015-09-22T00:53:00.001-07:00

JavaScript… Первое знакомство

Я начал устраиваться на работу, но на такую, где я мог бы реализоваться как программист. Так как у меня нет тематического образования или какого-либо опыта программирования, то ищу вакансии где не нужен опыт… Т.е. те вакансии, на которые требуются стажеры, начинающие программисты и т.д.

Одна из компаний, в которой я хочу работать, публикует на своём сайте вакансии «для начинающих». И там я нашел прекрасную вакансию — Стажёр-разработчик на JavaScript 🙂

Сегодня по изучал историю JavaScript и понял, что голова у меня лопнет, но я хочу изучить этот язык!

Дали тестовое задание:

  1. Сортировщик карточек путешественников
  2. Написать свой небольшой js-фреймворк работы с css классами dom элементов. Итоговая функциональность и интерфейсы отдаются на ваше усмотрение

Дали 2 недели на решение, конечно же я сразу полез в интернет, так как кто-то м.б. уже получал это задание 😉 Естественно нашел решения. НО какой же из меня программист, если сам головой думать не буду? Да и толку (для меня) от этого не будет. Т.к. если серое вещество не тренировать, то оно будет вялым и неэффективным и никто меня в Швейцарию не позовет работать :))

Накачал книг по JavaScript, у меня есть 2 недели на то, чтобы прыгнуть выше своей головы и устроиться на стажировку в Яндекс!

UPD.: Прошла неделя, приступаем к решению технического задания —> здесь

Автор: Ilya Druzhinin
Дата публикации: 2015-09-21T05:00:00.000-07:00

Велосипеды на Javascript и jQuery

Интересная статья с habra. Полезно знать каждому.

«В очередной раз открыв код коллег и ужаснувшись, я решил написать эту статью. Надеюсь для кого-нибудь это будет полезным, заодно и мне будет проще новичкам объяснять что у них в коде не так, просто кинув ссылку на эту статью.
Безусловно количество таких вещей очень и очень велико, поэтому в статье ограничусь лишь некоторыми.»

http://habrahabr.ru/post/149237/

Автор: Sergiy Kamolov
Дата публикации: 2012-08-09T11:02:00.000+03:00