Архив за месяц: Январь 2012

Оптимизация HTML и CSS-кода для разных браузеров с помощью DOCTYPE или DTD

Опубликовано автором
Добавить комментарий

Бывает, что определенная связка HTML+CSS никак не хочет правильно (с точки зрения создателя кода, конечно) отображаться в некоторых браузерах. Использование своих таблиц стилей для отдельных браузеров уже стало классикой. Но можно ненароком забыть что первая строка HTML-файла, которая должна начинаться с <!DOCTYPE, может сильно повлиять на интерпретацию кода.
Описаний типа документа, или DTD, существует много, и браузер будет отображать код по разному, в зависимости от того, какой DOCTYPE выбран.

Например (строгий HTML 4.01):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

отличается от (переходной HTML 4.01):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

или от (HTML 5):

<!DOCTYPE html>

Так что если что то не ладится с кодом, попробуйте поиграть и этой строкой.

Hello world в jQuery AJAX

Опубликовано автором
Добавить комментарий

Начать использовать jQuery очень просто, а вместе с ним и AJAX, который также становится очень простым в этой связке. Смотрите пример ниже. Для простоты библиотека jQuery берется с сайта googleapis.com, но вы можете разместить ее и локально. Обратите внимание, что все файлы должны быть в кодировке UTF-8.

Итак, листинг ajax.html (это файл, который необходимо вызвать в браузере):

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; Charset=UTF-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
</head>
<body>
  <div id="content"></div>
  <input id="show_btn" type="button" value="Показать"/>
  <input id="close_btn" type="button" value="Закрыть"/>
  <input id="pos_id" type="hidden" value="5"/>
  <script src="ajax.js" type="text/javascript"></script>
</body>
</html>

Далее листинг ajax.js:

$(document).ready(function(){ 
  $('#show_btn').click(function(){ 
    $.ajax({ 
      url: 'ajax_servlet.php', 
      data: 'id='+$('#pos_id').val(), 
      cache: false, 
      success: function(html){ 
        $('#content').html(html); 
      } 
    }); 
  }); 
  $('#close_btn').click(function(){ 
    $('#content').html(''); 
  });
});

Ну и наконец файл, отвечающий на AJAX-запрос на стороне сервера, ajax_servlet.php:

<?php
echo
  "Привет мир!<br/>".
  "Скрытый параметр id=".$_GET['id']
;
?>