Сравните порядок двух элементов HTML
У меня есть функция, которая принимает два параметра, каждый из которых имеет тип элемента HTML. Предполагается, что он возвращает, какой элемент появляется первым в порядке документа. Есть ли простой способ определить это?
Шаблон -
<body>
<div id = "div1">
<div id = "div2">
</div>
</div>
<div id = "div3">
<div id = "div4">
</div>
</div>
</body>
JS-
const elem1 = document.getElementById('div2');
const elem2 = document.getElementById('div4');
const firstAppearingElement = checkOrder(elem1, elem2); // it should return elem1
function checkOrder(element1, element2) {
// check which one appears first in dom tree
}
Ваш вопрос/концепция неясны. Предоставьте нам более подробное описание того, что вы пытаетесь выполнить, чтобы мы могли помочь вам более эффективно.
@amn какой документ? HTML-документ? файл JSON?
Я удалил свой комментарий, потому что checkOrder немного расплывчато. Тем не менее, большинство других деталей, включая то, что я упомянул в комментарии, есть. Кроме того, в вопросе говорится: «Элемент HTML», ссылаясь на ваш комментарий выше. Откуда вы делаете вывод о «файле [файлах] JSON»?
Я отклонил вопрос, потому что он не показывает каких-либо исследовательских усилий.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы можете попробовать с Node.compareDocumentPosition()
The Node.compareDocumentPosition() method compares the position of the given node against another node in any document.
Синтаксис object.compareDocumentPosition (nodeToCompare);
let first = document.getElementById('a');
let second=document.getElementById('b');
// Because the result returned by compareDocumentPosition() is a bitmask, the bitwise AND operator has to be used for meaningful results.See link above for more
if (first.compareDocumentPosition(second) & Node.DOCUMENT_POSITION_FOLLOWING) {
console.info('element with id a is before element with id b'); //
} else {
console.info('element with id a is after element with id b');
}<div id = "a"></div>
<div id = "b"></div>Когда вы впервые предлагаете идиоматическое решение, идеально подходящее к заданному вопросу, я бы, по крайней мере, использовал его наилучшим образом, например, устранив двусмысленность с помощью 'before' и 'after' - что до чего и что после чего? Точно так же ваш фрагмент HTML абсолютно не нужен — подразумевается, что это DOM, а фрагмент имеет дело с узлами DOM. В остальном, как я уже сказал, очень подходящий ответ!
Вам настоятельно рекомендуется включить в свой вопрос подходы, которые вы уже пробовали.