Blog. Just Blog

Web-мастеру и не только

Полезные решения для Web-мастеров
Web-мастеру и не только - RSS-канал Web-мастеру и не только - Карта сайта

Использование HTML-комментариев для хранения данных

16.10.2010 | Категория: Web-мастеру и не только | Автор: ManHunter
Как-то меня посетила мысль проверить, как определяются HTML-комментарии в DOM-структуре документа, и как можно получить доступ к их содержимому. Ведь по сути они являются полноправными составляющими документа. Напрямую, через ID, имя и другими подобными способами, естественно, сделать это не получится, т.к. тег комментария не имеет ничего подобного. Но сделать это все-таки удалось, привязавшись к соседнему тегу одного уровня с нужным комментарием. После этого элемент комментария со всеми потрохами можно получить через функцию JavaScript nextSibling или previousSibling, в зависимости от вашей ситуации. Это можно посмотреть, например, вот на таком фрагменте кода:
Code (HTML) : Убрать нумерацию
  1. <div>
  2. <!--first comment--><div id="main_div">Main DIV</div><!--second comment-->
  3. </div>
  4.  
  5. <script type="text/javascript">
  6. // Получить опорный элемент
  7. var el=document.getElementById('main_div');
  8. // Сообщение "first comment"
  9. alert(el.previousSibling.nodeValue);
  10. // Сообщение "second comment"
  11. alert(el.nextSibling.nodeValue);
  12. </script>
Можно, конечно, перебрать все дочерние элементы документа, начиная от корневого, но описанным выше способом удобнее выбрать именно нужный комментарий. Способ с перебором элементов тоже приведу:
Code (HTML) : Убрать нумерацию
  1. <div id="overall">
  2.   <a href="#">link</a>
  3.   <!--first comment-->
  4.   <div id="inner_div">
  5.      inner div
  6.      <!--second comment-->
  7.   </div>
  8.   plain text
  9. </div>
  10.  
  11. <script type="text/javascript">
  12. var el=document.getElementById('overall');
  13. for (var i = 0; i < el.childNodes.length; i++) {
  14.   if (el.childNodes[i]=='[object Comment]' ||
  15.       el.childNodes[i]=='[object HTMLCommentElement]') {
  16.     alert(el.childNodes[i].nodeValue);
  17.   }
  18. }
  19. </script>
Последовательно перебираются все дочерние элементы, если текущий объект имеет тип [object Comment] или [object HTMLCommentElement] (в случае Internet Explorer), то значит найден комментарий. Несмотря на некоторые неудобства, способ с обходом дерева DOM тоже можно использовать, когда привязка к строго определенным элементам не требуется, а надо просто получить содержимое комментариев.

Читать статью целиком »
Просмотров: 5169 | Комментариев: 17

Проверка доступности функции PHP

23.09.2010 | Категория: Web-мастеру и не только | Автор: ManHunter
Ковырялся как-то в очередном сплойте, которым скрипткиддисы пытались проломить блог. Среди всякого говна нашел там интересную идею о проверке доступности функций PHP перед их вызовом. Реализация была такая же кривая, как и весь остальной код этих быдлохакеров, поэтому я переписал функцию проверки по-своему. Проверка выполняется тремя способами: анализом значения параметра disable_functions в файле php.ini, а также через функции PHP function_exists и is_callable. Использование всех трех способов проверки дает абсолютно точный результат.
Code (PHP) : Убрать нумерацию
  1. //--------------------------------------------------------------------------
  2. // Функция проверки существования и доступности другой функции PHP
  3. //--------------------------------------------------------------------------
  4. // Параметры: $func - строка имени функции
  5. // На выходе: true - функция есть и доступна для вызова,
  6. //            false - функция недоступна по какой-либо причине
  7. //--------------------------------------------------------------------------
  8. function is_function_enabled($func) {
  9.     $func=strtolower(trim($func));
  10.     if ($func=='') return false;
  11.     // Получить список функций, отключенных в php.ini
  12.     $disabled=explode(",",@ini_get("disable_functions"));
  13.     if (empty($disabled)) {
  14.         $disabled=array();
  15.     }
  16.     else {
  17.         // Убрать пробелы и привести названия к нижнему регистру
  18.         $disabled=array_map('trim',array_map('strtolower',$disabled));
  19.     }
  20.     // Проверить доступность функции разными способами
  21.     return (function_exists($func) && is_callable($func) &&
  22.             !in_array($func,$disabled)
  23.     );
  24. }
Пример использования:
Code (PHP) : Убрать нумерацию
  1. // Проверка доступности функции shell_exec
  2. if (is_function_enabled('shell_exec')) {
  3.     echo shell_exec('ping yandex.ru');
  4. }
Функцию можно использовать, например, для проверки доступности нужных вам функций на различных бесплатных хостингах с ограничениями, или для выбора функции взаимодействия с операционной системой, типа shell_exec, если часть из них по какой-то причине запрещены.

Просмотров: 7612 | Комментариев: 5

Стилизация checkbox с использованием CSS и JavaScript

11.08.2010 | Категория: Web-мастеру и не только | Автор: ManHunter
В некоторых случаях при верстке макетов сайтов возникает необходимость нестандартной стилизации различных полей ввода HTML-форм. Например, дизайнер в фотошопе слепил красивый шаблон с вычурными графическими элементами, макет утвержден и заказчик слышать ничего не хочет про "стандартные элементы управления". Оформить поля ввода и всякие кнопочки еще не проблема, а вот с элементом checkbox уже сложнее. Мало того, что каждый браузер его отрисовывает по-своему, так еще визуально у него поменять ничего нельзя. Для решения проблемы можно воспользоваться следующим хитрым трюком: checkbox помещается внутрь контейнера, например div, после этого сам checkbox визуально скрывается путем установки ему 100% прозрачности, а у контейнера меняется стиль в зависимости от состояния "галочки" в checkbox.
Code (HTML) : Убрать нумерацию
  1. <style type="text/css">
  2. /* Стиль для обертки отмеченного checkbox'а */
  3. div.boxChecked {
  4.     background: url("checkbox.gif") no-repeat 0 3px;
  5. }
  6. /* Стиль для обертки неотмеченного checkbox'а */
  7. div.boxUnchecked {
  8.     background: url("checkbox.gif") no-repeat 0 -18px;
  9. }
  10. /* Прозрачный стиль для checkbox'а */
  11. div.boxChecked input, div.boxUnchecked input {
  12.     cursor: pointer;
  13.     margin: 0px;
  14.     padding: 0px;
  15.     width: 16px;
  16.     opacity: 0;
  17.     -moz-opacity: 0;
  18.     -khtml-opacity: 0;
  19.     filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  20. }
  21. </style>
Для фона отмеченного и неотмеченного checkbox'а используется одно и то же цельное изображение, только оно сдвинуто по вертикали для различных положений. Это позволяет менять фон без дополнительной загрузки новых изображений и связанного с этим неприятного моргания. Кроссбраузерный стиль checkbox'а устанавливает для него полную прозрачность. К сожалению, специфические определения стиля типа -moz-opacity, -khtml-opacity и filter не соответствуют спецификации CSS, поэтому, если вы хотите добиться полного прохождения валидатора, то придется извернуться с JavaScript.

Читать статью целиком »
Просмотров: 20598 | Комментариев: 14

Определение MIME-type файла по его расширению

03.07.2010 | Категория: Web-мастеру и не только | Автор: ManHunter
MIME - Multipurpose Internet Mail Extension - стандарт для определения типа передаваемой информации и механизмов ее обработки. Он сообщает браузерам о том, как им надо обращаться с запрошенными файлами, имеющими то или иное расширение. Так, например, если сервер отдает браузеру в заголовках тип MIME "text/html" для файлов с расширениями htm, html и shtml, то браузер интерпретирует все файлы с этими расширениями как файлы HTML. Также очень желательно передавать корректный MIME-type при отдаче файлов скриптом в антилич-системах.

Недавно я ковырялся в одной коммерческой CMS с закрытым кодом и нашел там одну полезную функцию с большим списком MIME-типов для различных расширений файлов (всего около 400). Реализация самой функции была сделана ужасно, поэтому я ее тут даже приводить не буду. Список я немного почистил и сохранил в удобном для работы виде. Функцию тоже переписал:
Code (PHP) : Убрать нумерацию
  1. //----------------------------------------------------------
  2. // Функция определения MIME-типа файла по его расширению
  3. //----------------------------------------------------------
  4. function get_mime_type($ext) {
  5.     // Массив с MIME-типами
  6.     global $mimetypes;
  7.     // Расширение в нижний регистр
  8.     $ext=trim(strtolower($ext));
  9.     if ($ext!='' && isset($mimetypes[$ext])) {
  10.         // Если есть такой MIME-тип, то вернуть его
  11.         return $mimetypes[$ext];
  12.     }
  13.     else {
  14.         // Иначе вернуть дефолтный MIME-тип
  15.         return "application/force-download";
  16.     }    
  17. }
На входе функция получает расширение файла без точки, например, "zip", "MP3", и возвращает его MIME-тип, если его можно определить, или дефолтный, если расширение не содержится в списке. Расширение файла удобнее всего получить функцией pathinfo.

Читать статью целиком »
Просмотров: 15952 | Комментариев: 9

Динамическое добавление скриптов на web-страницу

16.06.2010 | Категория: Web-мастеру и не только | Автор: ManHunter
Современные динамические интерфейсы web-страниц подразумевают не только изменение содержимого различных тегов, но и динамическую подгрузку скриптов JavaScript с их последующим выполнением. Например, получение скриптов или данных для них через AJAX. Способы передачи данных я тут рассматривать не буду, а расскажу о том, как динамически добавить скрипт на сформированную web-страницу и затем выполнить его. Это можно сделать как минимум двумя способами. Первый способ - добавление скрипта средствами JavaScript с использованием стандартной функции eval. Она получает в качестве аргумента строку и, рассматривая ее содержимое как код JavaScript, пытается выполнить. Например:
Code (JavaScript) : Убрать нумерацию
  1. <script type="text/javascript">
  2. eval('function do_my_job(txt) { alert(txt); }');
  3. do_my_job('ok');
  4. </script>
Второй способ, более корректный, - это добавление скриптов через DOM. При этом создается новый объект script, заполняется его тип и текст, а затем созданный объект добавляется в качестве дочернего элемента к элементу head. В этом случае добавленный скрипт будет сразу же выполнен. Для удобства я написал небольшую функцию, получающую в качестве аргумента текст скрипта, и добавляющую его на страницу.
Code (JavaScript) : Убрать нумерацию
  1. <script type="text/javascript">
  2. function add_script(txt) {
  3.     var newScript = document.createElement("script");
  4.     newScript.type = "text/javascript";
  5.     newScript.text = txt;
  6.     document.getElementsByTagName('head')[0].appendChild(newScript);
  7. }
  8. </script>
Во всех тестовых браузерах (IE 5.5-8, Opera 7-10, Firefox 2-3, Chrome, Safari и т.д.) скрипт выполнялся также при добавлении его к элементу body. Опытным путем установлено, что скрипт срабатывает при добавлении и к другим элементам страницы, но лучше, наверное, так не делать для сохранения кроссбраузерности и совместимости.

Читать статью целиком »
Просмотров: 16879 | Комментариев: 15

prev 01 ... 31 32 33 34 35 36 37 ... 42 next
Это я :-)
Если программист в девять утра уже на работе, значит он там же и ночевал
Главная страница Web-мастеру и не только Образ мышления: Assembler Мои программы Software Темная сторона Силы Обзоры техники А еще я туда ем! Жизнь в оффлайне Всякая всячина
Карта сайта Ссылки Обратная связь Правила сайта Настройки сайта RSS-канал
Ограничение по возрасту 16+ Материалы, опубликованные на этом сайте, не рекомендуются к просмотру лицам в возрасте до 16 лет без присутствия взрослых.
Метки статей
.NET (27), AJAX (5), Assembler (350), COM (40), CSS (39), Exif (15), FASM (8), Firefox (7), HDD (17), Hello Teddy (9), HTML (48), iconBIT (4), JavaScript (68), MySQL (13), Nikon (19), PDF (9), PHP (119), Samsung (6), SEO (12), Sublime Text (9), TintonLife (4), UGREEN (4), Windows 7 (66), аккумуляторы (22), аксессуары (12), анализаторы файлов (8), архиваторы (5), аттракционы (7), безопасность (55), браузеры (16), бытовая техника (19), варенье (18), ВВЦ (9), ВДНХ (14), видео (20), Воробьевы горы (9), вторые блюда (120), выпечка (27), выставки (116), генератор ПСЧ (10), графика (118), десерты (31), Египет (8), заготовки на зиму (45), закуска (21), закуска к пиву (24), зарядные устройства (23), защита (15), зоопарки (10), игры (36), иконки (22), интерфейс (26), исследование защиты (306), каша (4), клавиатура (7), Коломенское (37), консоль (7), концерты (52), Кузьминки (4), куклы (27), ледяные скульптуры (6), мои программы (68), мониторы (6), музеи (72), мультимедиа (71), мясо (59), напитки (14), ноутбуки (8), обфускация (7), окна (69), оформление сайта (47), парки Москвы (7), песчаные скульптуры (13), плееры (10), подводная съемка (4), поздравления (127), полезные функции (39), прохождения (4), процессы (25), птица (20), путешествия (25), распаковка (22), реверсинг (51), рыба (34), салаты (18), сброс триала (4), сеть (36), система (177), Сокольники (8), соусы (14), супы (14), телефоны (8), Тунис (6), умный дом (12), файлы справки (6), фаст-фуд (18), фестиваль цветов (5), флешки (5), фото (23), хеши (16), числа (8), юмор (12), яйца (17), Яндекс (10)
Вам помог этот сайт?
Сказать спасибо! Поблагодарили 34,351 раз
<< 2024 - АПРЕЛЬ >>
Пн Вт Ср Чт Пт Сб Вс
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30          
Международный день секретаря
Международный день солидарности молодежи
Всемирный день защиты лабораторных животных
Всемирная неделя иммунизации
Нашли на сайте орфографическую ошибку? Выделите ее мышкой и нажмите
Ctrl
+
Enter
Буду очень благодарен, если размеcтите мою кнопочку:
Личный блог ManHunter'а
Valid CSS Valid XHTML 1.0 Transitional Valid mobileOK Basic Valid RSS
Яндекс тИЦ: {YANDEX_TIC} Яндекс ИКС: 380
Сейчас я слушаю
---
Имя:

Сообщение:

Осталось символов: 200

   
-
Наверх
Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2024
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.09 сек. / MySQL: 2 (0.0024 сек.) / Память: 4.5 Mb
Наверх