Рубрика «dom» - 5

Похоже на первоапрельскую шутку, но Adobe Type Team выпустила специальный шрифт Adobe Blank OpenType Font, покрывающий всю unicode таблицу пустыми глифами (более 65,000). Шрифт рендерится с использованием non-spacing и non-marking глифов и весит 80kB.

Adobe Blank: Шрифт для разработчиков

Основой для разработки шрифта послужили две задачи:
Читать полностью »

Исторический экскурс

Ранее я уже писал на хабре о Grab — фреймворке для написания парсеров сайтов: раз, два, три, четыре. В двух словах, Grab это удобная оболочка поверх двух библиотек: pycurl для работы с сетью и lxml для разбора HTML-документов.Читать полностью »

Скажу сразу, всю DOM-модель мы строить не будем, а лишь рассмотрим ее элементы и как с ними работать при помощи jQuery. Статья рассчитана на начинающих или тех кто хочет вспомнить как можно строить элементы «на лету», надеюсь кому-то это будет полезно.
Большинство веб-разработчиков сталкивается с необходимостью вставить какое-либо содержимое из js, возможно это ajax или событие. Но никто не задумывается о том что с вашим кодом возможно кому-то придется работать. И часто даже в очень известных плагинах можно встретить код такого типа:

var content = "<table>"
for(i=0; i<3; i++){
    content += '<tr><td>' + 'result ' +  i + '</td></tr>';
}
content += "</table>"

$('#table').append(content);

Сразу видно, что этот кусочек кода сделан на быструю руку, я и сам так когда-то делал, но ведь можно сделать и лучше.
В статье я вывел самые основные элементы которые используются при разработке, возможно они помогут вам сэкономить время.
Под катом много кода с примерами.
Читать полностью »

Переписывал на работе кусок одного сервиса с Python на Erlang. Сам сервис занимается тем, что скачивает по HTTP значительное количество однотипных HTML страниц и извлекает из них некоторую информацию. Основная CPU нагрузка сервиса приходится на парсинг HTML в DOM дерево.

Сперва захотелось сравнить производительность Erlang парсера mochiweb_html с используемым из Python lxml.etree.HTML(). Провел простейший бенчмарк, нужные выводы сделал, а потом подумал что неплохо было бы добавить в бенчмарк ещё парочку-другую парсеров и платформ, оформить покрасивее, опубликовать код и написать статью.
На данный момент успел написать бенчмарки на Erlang, Python, PyPy, NodeJS и С в следующих комбинациях:

  • Erlang — mochiweb_html
  • CPython — lxml.etree.HTML
  • CPython — BeautifulSoup 3
  • CPython — BeautifulSoup 4
  • CPython — html5lib
  • PyPi — BeautifulSoup 3
  • PyPi — BeautifulSoup 4
  • PyPi — html5lib
  • Node.JS — cheerio
  • Node.JS — htmlparser
  • Node.JS — jsdom
  • C — libxml2 (скорее для справки)

В тесте сравниваются скорость обработки N итераций парсера и пиковое потребление памяти.

Интрига: кто быстрее — Python или PyPy? Как сказывается иммутабельность Erlang на скорости парсинга и потреблении памяти? Насколько быстра V8 NodeJS? И как на всё это смотрит код на чистом C.
Читать полностью »

Совсем недавно Microsoft представила новый язык программирования TypeScript. Наверняка многим понравилось наличие типизации и плагины для Microsoft Visual Studio и других редакторов. Чтобы оценить насколько полезен язык в разработке, я решил поиграться с ним, написав небольшой код, который поможет в разработке приложений.

Каждый с этим сталкивался

Любой, кто разрабатывал приложения с использованием технологий HTML+js, знает, что очень часто приходится решать задачу шаблонизации данных на представлении. Существуют множество решений: как с использованием фреймворков (раз, два, три, четыре и так далее), так и простые методики, вроде таких:
Читать полностью »

В данной статье я расскажу о новинка в DOM API, которые мы можем использовать уже сейчас или в ближайшем будущем.
Публикация статьи приурочена к радостному событию реализации некоторых новых DOM4 API методов в Google Chrome. Многие методы и свойства можно использовать уже сейчас, некоторые из них работают через префиксы, но к каждому методу или свойству я постараюсь дать Polyfill, реализующий их или отбрасывающий браузерные префиксы.

Читать полностью »

Хабрастатистика

Собственно после появления довольно интересного и популярного топика Хабракамп товарищ opium создал вопрос, где предложил создать скрипт статистики.

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

Также я столкнулся с проблемами, которые раньше еще не видал.
Полезный опыт, как никак.
Читать полностью »

I. Суть проблемы.

В список основных предназначений XMLHttpRequest, конечно, не входит запрос HTML, чаще этот инструмент взаимодействует с XML, JSON или простым текстом.

Однако связка XMLHttpRequest + HTML хорошо работает при создании расширений к браузеру, которые в фоновом режиме опрашивают на предмет новостей сайты, не предоставляющие для этого почтовую подписку, RSS или другие экономные API или предоставляющие эти сервисы с какими-то ограничениями.

При создании нескольких расширений для Firefox я сталкивался с такой необходимостью. Работать с полученным от XMLHttpRequest кодом HTML при помощи регулярных расширений — способ очень ненадёжный и громоздкий. Получить DOM от XMLHttpRequest можно было лишь для правильного XML. Поэтому приходилось следовать хитрым советам на сайте разработчиков. Однако начиная с Firefox 11 появилась возможность непосредственного получения DOM от XMLHttpRequest, а в Firefox 12 была добавлена обработка таймаутов.

Я испытал новую возможность на создании мини-индикаторов новых топиков для двух небольших форумов, и это оказалось очень удобным (50 строчек кода плюс расширение CustomButtons — вот и готовый индикатор за пять минут, с опросами по таймеру и четырьмя состояниями: нет новостей, есть новости, ошибка и таймаут). Всё работало как часы.

Поэтому я попытался убрать из кода своих расширений все прежние костыли и ввести туда новый удобный парсинг. Однако при работе с сайтом rutracker.org возникла странная проблема (тестирование проходит на последней ночной сборке под Windows XP; очень прошу прощения за все косяки в коде и формулировках: у меня нет программистского образования и опыт мой в этой сфере, к сожалению, очень невелик.).

Читать полностью »

Ну что же плывем дальше, а на очереди следующие 4 функций, связанные с путешествием по Антоновке. Для начала определимся с понятием «чего надобно». Итак, я хочу:

  • выбирать элементы по атрибуту ID;
  • выбирать элементы по атрибуту NAME;
  • выбирать элементы определенного тэга;
  • выбирать элементы определенного класса.

Читать полностью »

Ну что же ползем дальше. Надо же нам как-то уметь передвигаться по Антоновке, поэтому давайте рассмотрим первые пять функций, которые реализуют «простенькие шажки» по DOM.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js