javascript — Как определить родительский элемент
Вопрос задан
Изменён 7 лет 2 месяца назад
Просмотрен 756 раз
Необходимо на Javascript (кроссбраузерно) определить родительский элемент — container для тега <script src="script.js"></script> (из самого скрипта — script.js) Учитывая то, что таких конструкций <div>...</div> может быть несколько и для каждой нужно определить container.
<div>
<script type="text/javascript">
var onViewable = function (result) {
if (result) {
}
}
</script>
<script src="script.js"></script>
</div>
- javascript
- dom
5
Есть такое свойство currentScript, но оно поддерживается не везде.
Соответственно найти родителя просто:
var parentElement = document.currentScript.parentNode;
Нашелся еще один трюк, работает во всех браузерах если вы динамически не добавляете элементы <script>
var parentElement = document.scripts[document.scripts.length - 1].parentNode;
Пример:
<div>Test script 1 <script> document.currentScript.parentNode.style.border = '1px solid blue'; </script> </div> <div>Test script 2 <script> document.scripts[document.scripts.length - 1].parentNode.style.border = '1px solid red'; </script> </div> <div>Test script 3 <script> document.scripts[document.scripts.length - 1].parentNode.style.border = '1px solid green'; </script> </div> <div>Test script 4 <script> document.currentScript.parentNode.style.border = '1px solid green'; </script> </div>
Первый и последний <div> будут без рамки в IE.
5
Зарегистрируйтесь или войдите
Регистрация через Google
Регистрация через Facebook
Регистрация через почту
Отправить без регистрации
Почта
Отправить без регистрации
Почта
Необходима, но никому не показывается
Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки
JS JavaScript Элемент
❮ Назад Дальше ❯
Объект элемента
В HTML DOM объект element представляет элемент HTML, например P, div, A, Table или любой другой HTML-элемент.
Свойства и методы
Следующие свойства и методы можно использовать для всех элементов HTML:
| Свойство / Метод | Описание |
|---|---|
| accessKey | Задает или возвращает атрибут AccessKey элемента |
| addEventListener() | Присоединяет обработчик событий к указанному элементу |
| appendChild() | Добавляет новый дочерний узел к элементу в качестве последнего дочернего узла |
| attributes | Возвращает намеднодемап атрибутов элемента |
| blur() | Удаление фокуса из элемента |
| childElementCount | Возвращает количество дочерних элементов, которые имеет элемент |
| childNodes | Возвращает коллекцию дочерних узлов элемента (включая узлы текста и комментария) |
| children | Возвращает коллекцию дочернего элемента элемента (исключая текстовые и комментарии узлы) |
| classList | Возвращает имя (имена) класса элемента |
| className | Задает или возвращает значение атрибута Class элемента |
| click() | Имитирует щелчок мышью по элементу |
| clientHeight | Возвращает высоту элемента, включая заполнение |
| clientLeft | Возвращает ширину левой границы элемента |
| clientTop | Возвращает ширину верхней границы элемента |
| clientWidth | Возвращает ширину элемента, включая заполнение |
| cloneNode() | Клонирование элемента |
| compareDocumentPosition() | Сравнивает положение документа двух элементов |
| contains() | Возвращает значение true, если узел является потомком узла, в противном случае — false |
| contentEditable | Задает или возвращает ли содержимое элемента редактируемым или нет |
| dir | Задает или возвращает значение атрибута DIR элемента |
| firstChild | Возвращает первый дочерний узел элемента |
| firstElementChild | Возвращает первый дочерний элемент элемента |
| focus() | Придает фокус элементу |
| getAttribute() | Возвращает указанное значение атрибута узла элемента |
| getAttributeNode() | Возвращает указанный узел атрибута |
| getElementsByClassName() | Возвращает коллекцию всех дочерних элементов с указанным именем класса |
| getElementsByTagName() | Возвращает коллекцию всех дочерних элементов с указанным именем тега |
| hasAttribute() | Возвращает значение true, если элемент имеет указанный атрибут, в противном случае false |
| hasAttributes() | Возвращает значение true, если элемент имеет какие-либо атрибуты, в противном случае false |
| hasChildNodes() | Возвращает значение true, если элемент имеет дочерние узлы, в противном случае — false |
| id | Задает или возвращает значение атрибута ID элемента |
| innerHTML | Задает или возвращает содержимое элемента |
| innerText | Задает или возвращает текстовое содержимое узла и его потомков |
| insertAdjacentElement() | Вставляет элемент HTML в заданной позиции относительно текущего элемента |
| insertAdjacentHTML() | Вставляет HTML-форматированный текст в заданной позиции относительно текущего элемента |
| insertAdjacentText() | Вставка текста в заданную позицию относительно текущего элемента |
| insertBefore() | Вставляет новый дочерний узел перед указанным, существующим, дочерним узлом |
| isContentEditable | Возвращает значение true, если содержимое элемента является редактируемым, в противном случае — false |
| isDefaultNamespace() | Возвращает значение true, если указанное NamespaceURI является значением по умолчанию, в противном случае — false |
| isEqualNode() | Проверяет, равны ли два элемента |
| isSameNode() | Проверяет, является ли два элемента один и тот же узел |
| isSupported() | Возвращает значение true, если указанный элемент поддерживается в элементе |
| lang | Задает или возвращает значение атрибута lang элемента |
| lastChild | Возвращает последний дочерний узел элемента |
| lastElementChild | Возвращает последний дочерний элемент элемента |
| namespaceURI | Возвращает URI пространства имен элемента |
| nextSibling | Возвращает следующий узел на том же уровне дерева узлов |
| nextElementSibling | Возвращает следующий элемент на том же уровне дерева узлов |
| nodeName | Возвращает имя узла |
| nodeType | Возвращает тип узла узла |
| nodeValue | Задает или возвращает значение узла |
| normalize() | Соединяет соседние текстовые узлы и удаляет пустые текстовые узлы в элементе |
| offsetHeight | Возвращает высоту элемента, включая заполнение, границу и полосу прокрутки |
| offsetWidth | Возвращает ширину элемента, включая заполнение, границу и полосу прокрутки |
| offsetLeft | Возвращает горизонтальное положение смещения элемента |
| offsetParent | Возвращает контейнер смещения элемента |
| offsetTop | Возвращает вертикальное положение смещения элемента |
| ownerDocument | Возвращает корневой элемент (объект Document) для элемента |
| parentNode | Возвращает родительский узел элемента |
| parentElement | Возвращает родительский узел элемента |
| previousSibling | Возвращает предыдущий узел на том же уровне дерева узлов |
| previousElementSibling | Возвращает предыдущий элемент на том же уровне дерева узлов |
| querySelector() | Возвращает первый дочерний элемент, соответствующий указанному селектору CSS элемента |
| querySelectorAll() | Возвращает все дочерние элементы, соответствующие указанному селектору CSS элемента |
| removeAttribute() | Удаляет указанный атрибут из элемента |
| removeAttributeNode() | Удаляет указанный узел атрибута и возвращает удаленный узел |
| removeChild() | Удаляет дочерний узел из элемента |
| removeEventListener() | Удаляет обработчик событий, который был присоединен с помощью метода addEventListener () |
| replaceChild() | Заменяет дочерний узел в элементе |
| scrollHeight | Возвращает всю высоту элемента, включая заполнение |
| scrollIntoView() | Прокручивает указанный элемент в видимой области окна обозревателя |
| scrollLeft | Задает или возвращает количество пикселей, в течение которых содержимое элемента прокручивается горизонтально |
| scrollTop | Задает или возвращает количество пикселей, в течение которых содержимое элемента прокручивается вертикально |
| scrollWidth | Возвращает всю ширину элемента, включая заполнение |
| setAttribute() | Задает или изменяет указанный атрибут, к заданному значению |
| setAttributeNode() | Задает или изменяет указанный узел атрибута |
| style | Задает или возвращает значение атрибута Style элемента |
| tabIndex | Задает или возвращает значение атрибута TabIndex элемента |
| tagName | Возвращает имя тега элемента |
| textContent | Задает или возвращает текстовое содержимое узла и его потомков |
| title | Задает или возвращает значение атрибута Title элемента |
| toString() | Преобразует элемент в строку |
❮ Назад Дальше ❯
HTML DOM parentElement Свойство
❮ Предыдущий ❮ Ссылка на объект элемента Далее ❯
Примеры
Получить имя узла родительского элемента элемента
var x = document.
getElementById(«myLI»).parentElement.nodeName;
Попробуйте сами »
Нажмите на элемент (), чтобы скрыть его родительский элемент ( Попробуйте Это Сам » Свойство parentElement возвращает родительский элемент указанного
элемент. Разница между parentElement и parentNode заключается в том, что parentElement
возвращает null , если родительский узел не является узлом элемента: document.body.parentNode; // Возвращает элемент document.documentElement.parentNode; // Возвращает узел документа В большинстве случаев не имеет значения, какое свойство вы используете, однако parentNode
пожалуй, самый популярный. Это свойство доступно только для чтения. В HTML DOM (объектная модель документа) документ HTML представляет собой набор узлов с дочерними узлами (или без них). Узлы — это узлы элементов, текстовые узлы и узлы комментариев. Пробелы между элементами также являются текстовыми узлами. Элементы являются только узлами элементов. childNodes возвращает дочерние узлы (узлы элементов, текстовые узлы и узлы комментариев). children возвращает дочерние элементы (не узлы текста и комментариев). Братья и сестры — это «братья» и «сестры». Братья и сестры — это узлы с одним и тем же родителем (в том же списке дочерних узлов ). Родственные элементы — это элементы с одним и тем же родителем (в том же списке дочерних элементов ). node .parentElement Полностью поддерживается во всех современных браузерах: ❮ Предыдущий
❮ Ссылка на объект элемента
Следующий ❯ FORUM |
О W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения.
Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Авторское право 1999-2023 по данным Refsnes. Все права защищены. Получить родительский элемент DOM набора элементов DOM. Обратите внимание, что Правильное использование Неправильное использование selector (селектор String) Селектор, используемый для фильтрации соответствующих элементов DOM. Опции (Объект) Передайте объект параметров, чтобы изменить поведение по умолчанию
x Определение и использование
document.body.parentElement; // Возвращает элемент
документ.documentElement.parentElement; // Возвращает null ( не имеет родительского узла ELEMENT)
Узлы HTML и элементы
childNodes vs children
Братья и сестры против Элементов Братья и сестры
Синтаксис
Технические детали
Возвращаемое значение: Объект Element, представляющий узел родительского элемента узла, или null , если узел не имеет родителя Поддержка браузера
element.parentElement — это функция DOM Level 3 (2004). Хром Край Фаерфокс Сафари Опера ИЭ Да Да Да Да Да 11 НАБОР ЦВЕТА
Лучшие учебники
Учебник по HTML
Учебник по CSS
Учебник по JavaScript
Учебник How To
Учебник по SQL
Учебник по Python
Учебник по W3.
CSS
Учебник по Bootstrap
Учебник по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery Лучшие ссылки
Справочник по HTML
Справочник по CSS
Справочник по JavaScript
Справочник по SQL
Справочник по Python
Справочник по W3.CSS
Справочник по Bootstrap
Справочник по PHP
Цвета HTML
Справочник по Java
Справочник по Angular
Справочник по jQuery
6 Top1 Examples
Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры How To
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery 
Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования,
куки-файлы и политика конфиденциальности.
W3Schools работает на основе W3.CSS. родитель | Документация Cypress
.parent() перемещается только на один уровень вверх по дереву DOM, как
в отличие от команды .parents(). Синтаксис
.parent()
.parent(селектор)
.parent(опции)
.parent(селектор, опции)
Использование
cy.get('header').parent() // Выдает родительский el `header`
cy.parent() // Ошибки, не могут быть объединены в цепочку с 'cy'
cy.reload().parent() // Ошибки, 'reload' не возвращает элемент DOM
Аргументы
.parent() . Option Default Description log true Displays the command in the Command log timeout defaultCommandTimeout Time ждать разрешения .parent() до истечения времени ожидания Yields
.parent() возвращает новые найденные элементы DOM. .parent() — это запрос, и безопасно связывать дальнейшие команды. Примеры
Без аргументов
Получить родителя активного
li
Начало работы
1 >Установить
// дает .
