Что такое Дом?
1. Введение
Модель объекта документа (DOM) - это стандартный интерфейс программирования, рекомендованный организациями W3C для обработки расширяемых языков логотипа. Объектная модель документа может быть прослежена до «Битвы за браузер» между Microsoft и Netscape в конце 1990 -х годов. Чтобы бороться с жизнью и смертью с помощью JScript в JavaScript, обе стороны дали браузеру мощные функции в больших масштабах. Microsoft добавила много эксклюзивных вещей в технологию веб-страницы, включая VBScript, ActiveX и собственное формат Microsoft DHTML, что делает многие веб-страницы невозможными обычно отображать, используя не-микрософт-платформы и браузеры. Дом - это шедевр, который был завариен в то время.
DOM (модель объекта документа) - это интерфейс прикладной программы (API) для HTML и XML. DOM планирует всю страницу на документ, состоящий из уровней узлов.
Так называемая модель объекта документа на самом деле является внутренним представлением различных элементов на веб-странице HTML, таких как заголовки, параграфы, списки, стили, идентификаторы и т. Д. В HTML. Все элементы можно получить через DOM.
JavaScript в конечном итоге должен управлять HTML -страницей и превратить HTML в DHTML, и DOM необходим для работы на HTML -странице. DOM должен имитировать страницу HTML в объект. Если JavaScript выполняет только некоторые вычисления, петли и другие операции и не может работать с HTML, он потеряет свое значение.
DOM - это модель HTML -страницы. Каждый тег используется в качестве объекта. JavaScript может программно управлять текстовыми полями, уровнями и другими элементами на веб -странице, вызывая свойства и методы в DOM. Например, используя объект DOM текстового поля, вы можете прочитать значения в текстовом поле и установить значения в текстовом поле.
2. Иллюстрация
О окне вся страница или окно - это окно объект------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Переменные и методы, определенные на странице, являются окном
window.id
Document.getElementById ()
При использовании свойств и методов оконных объектов можно пропустить.
например:
window.alert ('hello');
Может быть опущено, чтобы предупреждать («Привет»);
window.document может быть написан непосредственно с помощью документа
Если вы не можете писать окно, не пишите его, так как это может уменьшить количество байтов в файле JS.
Кода -копия выглядит следующим образом:
window.alert («Привет всем!»); // Появится диалоговое окно предупреждения
window.confirm («Вы уверены, что хотите его удалить?
window.navigate (url); // переосмыслить веб-страницу на URL, поддержка IE и Opera11.6. Не рекомендуется, некоторые браузеры не работают,
Рекомендуется использовать window.location.href = 'url'; // Поддержка большинства браузеров
Динамически эксплуатировать элементы DOM
1. Получите DOM
getElementbyId (), (очень часто используется), получайте объект в соответствии с идентификатором элемента, и идентификатор на веб -странице не может быть повторен. Вы также можете ссылаться на элементы непосредственно через идентификатор элемента, но есть допустимая область.
getElementsbyname (), получите объект в соответствии с именем элемента. Поскольку имена элементов на странице могут быть повторены, такие как имена нескольких радиобултонов, возвращаемое значение getElementsbyname - это массив объектов.
getElementsbytagname (), получите множество элементов с указанным именем тега. Например, getElementsbytagname («Вход») может получить все теги <Input>. *Указывает все этикетки
2. Добавить, удалить, заменить
Document.Write может быть создан динамически только во время загрузки страницы.
Вы можете вызвать метод CreateElement документа, чтобы создать объект DOM с указанным тегом, а затем добавить вновь созданный элемент в соответствующий элемент, вызывая appendChild (); Метод определенного элемента. // родительский элемент object.removeChild (объект дочернего элемента); Удалить элемент.
CreateElement ('element'); создать узел
AppendChild (узел); Добавить узел
RemoveChild (узел); RemoveChild (узел); удалить узел
Replacechild (новый, старый); заменить узел
INSERTBEFOR (NEW, См.); Добавить узел спереди (вставьте к передней части узла)
Метод:
свойство:
Firstchild
LastChild
3. Используйте innerhtml или createelement (), appendchild () и removechild ()?
При манипулировании элементами страницы мы должны использовать innerhtml, createlement (), appendchild () и removechild ()?
1. При выполнении большого количества операций узлов производительность использования innerhtml лучше, чем частые операции DOM (существуют анализаторы HTML, специально написанные в C или C ++.). Сначала напишите код HTML страницы, а затем вызовите Innerhtml один раз, вместо многократного вызова innerhtml.
2. Для удаления узлов с использованием innerhtml = '' 'в некоторых случаях будут проблемы с памятью. Например: есть много других элементов под DIV, и каждый элемент связан с обработчиком событий. В настоящее время Innerhtml просто удаляет текущий элемент из дерева узлов, но эти обработчики событий все еще занимают память.
JS Operation Style
Стиль элемента - это свойство класса.
(Класс - это зарезервированное слово в JavaScript. Атрибут не может использовать ключевые слова или зарезервированные слова, поэтому оно становится названием ClassName) эффект блока переключения веб -страниц.
Модифицировать стиль элемента не может быть этим. Style = "foangy-color: красный".
Используйте «Стиль. Имя атрибута», чтобы изменить атрибуты стиля отдельно. Обратите внимание, что когда имена атрибутов работают в JavaScript в CSS, имена атрибутов могут быть разными, в основном сосредоточены на атрибутах, содержащих - в атрибутах, потому что - нельзя использовать в JavaScript.
При использовании стиля поплавки
Т.е. obj.style.stylefloat = 'right';
Другие браузеры: obj.style.cssfloat = 'right';
Форма объекта
Обычно используется: click (), focus (), blur (); // Оборудование - это событие, которое запускает щелчок элемента, получает фокус и теряет фокус через программу.
Объект формы является объектом DOM формы.
Метод: отправить () представляет форму, но событие OnSubmit не будет запускается.
Реализуйте AutoPost, то есть страница отправляется сразу после того, как фокус оставляет контроль, вместо того, чтобы отправлять только после того, как кнопка отправки будет отправлена. Когда курсор уходит, событие онкола запускается, и метод отправки формы вызывается в Onblur.
После нажатия отправки запускается событие формы в Onsubmit. Проверка данных может быть выполнена в Onsubmit. Если есть какие -либо проблемы с данными, верните False, чтобы отменить представление
Вышесказанное - мое личное понимание DOM JavaScript, и я надеюсь, что все это понравится.