Сегодняшний контент о том, как манипулировать объектами документов.
1. Работая метаданные документа Во -первых, давайте посмотрим на связанные атрибуты:Символ: Получите метод кодирования текущего документа, и это свойство только для чтения;
charset: получить или установить метод кодирования текущего документа;
COMPATMODE: Получить режим совместимости текущего документа;
cookie: получить или установить объект cookie текущего документа;
DefaultCharset: получить метод кодирования по умолчанию браузера;
DefaultView: получить объект окна текущего документа;
DIR: Получить или установить текстовое выравнивание текущего документа;
Домен: Получить или установить значение Domian текущего документа;
Реализация: предоставить информацию о поддерживаемых функциях DOM;
Полномодировано: Получите последнее время изменения документа (если нет последнего времени изменения, он возвращает текущее время);
Местоположение: предоставьте URL -информацию о текущем документе;
Readystate: возвращает статус текущего документа, который является свойством только для чтения;
Реферат: возвращает информацию о URL -адресе документа, подключенную к текущему документу;
Название: получить или установить название текущего документа.
Давайте посмотрим на следующий пример:
<! Doctype html>
<html>
<голова>
<title> Пример </title>
</head>
<тело>
<script type = "text/javascript">
document.writeln ('<pre>');
document.writeln ('incecmonset:' + document.characterset);
document.writeln ('charset:' + document.charset);
document.writeln ('compatmode:' + document.compatmode);
document.writeln ('defaultCharset:' + document.defaultCharset);
document.writeln ('dir:' + document.dir);
document.writeln ('домен:' + document.domain);
document.writeln ('lastmodified:' + document.lastmodified);
document.writeln ('referrer:' + document.referrer);
document.writeln ('title:' + document.title);
document.write ('</pre>');
</script>
</body>
</html>
Результаты (результаты, отображаемые разными браузерами, могут быть разными):
2. Как понять режим совместимостиСвойство COMPATMODE рассказывает вам, как браузер обрабатывает текущий документ. Сейчас слишком много нестандартного HTML, когда браузер попытается отобразить эти страницы, даже если они не соответствуют спецификации HTML. Некоторый контент опирается на уникальные функции, которые существовали в предыдущих войнах браузеров, и эти атрибуты камней не соответствуют норме. Compatmode возвращает одно или два значения следующим образом:
CSS1Compat: документ соответствует действительной спецификации HTML (не обязательно HTML5/"> HTML5, проверенная страница HTML4 также возвращает это значение);
BackCompat: документ содержит функции, которые не соответствуют спецификациям, запуская режим совместимости.
3. Используйте объект местоположенияDocument.Location возвращает объект местоположения, предоставляя вам информацию о адресах мелкозернистого документа, и позволяет вам перейти к другим документам.
Протокол: Получить или установить протокол для URL -адреса документа;
Хост: получить или установить информацию об хосте URL документа;
href: получить или установить информацию о адресе документа;
Имя хоста: получить или установить имя хоста документа;
Поиск: Получить или установить информацию о детали запроса на URL документа;
Хэш: Получить или установить информацию о хэш -хэш -детале с URL документа;
назначить (<URL>): перейдите к указанному URL;
заменить (<URL>): удалить текущий документ и перейдите к указанному URL;
reload (): перезагрузить текущий документ;
RESOLERURL (<URL>): измените относительный путь на абсолютный путь.
Давайте посмотрим на следующий пример :<! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<title> </title>
</head>
<тело>
<script type = "text/javascript">
document.writeln ('<pre>');
document.writeln ('protocol:' + document.location.protocol);
document.writeln ('host:' + document.location.host);
document.writeln ('hostname:' + document.location.hostname);
document.writeln ('port:' + document.location.port);
document.writeln ('pathname:' + document.location.pathname);
document.writeln ('search:' + document.location.search);
document.writeln ('hash:' + document.location.hash);
document.writeln ('</pre>');
</script>
</body>
</html>
результат:
4. Читайте и пишите cookie Через атрибут cookie вы можете добавлять, изменять и читать файлы cookie в документе. Как показано в следующем примере:<! Doctype html>
<html>
<голова>
<title> Пример </title>
<meta name = "Автор" content = "Adam Freeman" />
<meta name = "description" content = "простой пример" />
</head>
<тело>
<p id = "ciesiedata">
</p>
<button id = "write">
Добавить cookie </button>
<button id = "update">
Обновите cookie </button>
<button id = "clear">
Очистить cookie </button>
<script type = "text/javascript">
var cookiecount = 0;
document.getElementbyId ('update'). onclick = updateCookie;
document.getElementbyId ('write'). onclick = createCookie;
document.getElementbyId ('clear'). onclick = clearCookie;
readcookies ();
функция readcookies () {
Document.getElementById ('cookiedata'). innerhtml =! Document.cookie? '': document.cookie;
}
функция updateCookie () {
document.cookie = 'cookie_' + cookiecount + '= update_' + cookiecount;
readcookies ();
}
функция createCookie () {
CookieCount ++;
document.cookie = 'cookie_' + cookiecount + '= value_' + cookiecount;
readcookies ();
}
function clearcookie () {
var exp = new Date ();
exp.settime (exp.gettime () - 1);
var arrstr = document.cookie.split (";");
for (var i = 0; i <arrstr.length; i ++) {
var temp = arrstr [i] .split ("=");
if (temp [0]) {
document.cookie = temp [0] + "=; истекает =" + exp.togmtString ();
};
}
cookieCount = 0;
readcookies ();
}
</script>
</body>
</html>
результат:
5. Понять готовый участокDocument.ReadyState помогает вам понять текущее состояние страницы в процессе загрузки и анализа страницы. Можно помнить, что браузер будет выполняться немедленно при встрече с элементом сценария, если только вы не используете атрибут DEFE, чтобы задержать выполнение сценария. У RateState есть три значения, представляющие разные состояния.
Загрузка: браузер загружает и выполняет документ;
Interactive: Документ завершил анализ, но браузер загружает другие внешние ресурсы (медиа, картинки и т. Д.);
Завершите: анализ страницы завершен, а внешние ресурсы завершаются дома.
В течение всего процесса загрузки и анализа браузера значение readystate изменит одно за другим на загрузке, взаимодействии и завершении. При использовании в сочетании с событием BeadyStateChange (запускается при изменении состояния готовой штата), готовый участок становится довольно ценным.
<! Doctype html>
<html>
<голова>
<title> Пример </title>
<meta name = "Автор" content = "Adam Freeman" />
<meta name = "description" content = "простой пример" />
<Скрипт>
document.onreadystatechange = function () {
if (document.readystate == "Interactive") {
document.getElementById ("pressMe"). OnClick = function () {
document.getElementById ("Результаты"). innerHtml = "Нажатая кнопка";
}
}
}
</script>
</head>
<тело>
<button id = "pressme">
Нажмите мне </button>
<pre id = "Результаты"> </pre>
</body>
</html>
Приведенный выше код использует событие BeadyStateChange для достижения эффекта отсроченного выполнения. Только когда вся страница на странице будет проанализирована и свяжется, станет интерактивным значением готового штата. В настоящее время событие Click будет связано с кнопкой нажатия. Эта операция гарантирует, что все необходимые элементы HTML существуют и предотвращают ошибки.
6. Получить информацию об реализации атрибута DOMСвойство Document.Implementation помогает вам понять внедрение браузера свойства DOM. Это свойство возвращает объект доминирования, который содержит метод Hasfeature, с помощью которого вы можете понять реализацию браузера определенного свойства.
<! Doctype html>
<html>
<голова>
<title> Пример </title>
<meta name = "Автор" content = "Adam Freeman" />
<meta name = "description" content = "простой пример" />
</head>
<тело>
<Скрипт>
var features = ["core", "html", "css", "selectors-api"];
var -уровни = ["1,0", "2,0", "3.0"];
document.writeln ("<pre>");
for (var i = 0; i <features.length; i ++) {
document.writeln («Проверка функции:» + функции [i]);
for (var j = 0; j <levels.length; j ++) {
document.write (функции [i] + "level" + уровни [j] + ":");
document.writeln (document.implementation.hasfeature (функции [i], уровни [j]));
}
}
document.write ("</pre>")
</script>
</body>
</html>
Эффект: