Question

如何创建一个以2个元素作为参数并返回前一个元素的函数（在HTML代码中更多）？

例如，在这样的文档中：

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <h1 id="title"></h1>
    <h1 id="subtitle"></h1>
    <div>
      <span></span>
    </div>
  </body>
</html>

该函数将返回：

head

body

head

div

span

h1#title

h1#subtitle

false

html

html。

伪代码示例：

function firstElement(element1, element2) {
  let elementX = false;
  for ( ... ) {
    if ( ... ) {
      elementX = element1;
    } else {
      elementX = element2;
    }
  }
  return elementX;
}

Answer 1

您可以获取所有Dom元素，放入数组中检查IndexOf ..

例如..

注意：我已将all数组部分放在函数外部，以防您请求大量DOM检查，其中一个可以放在内部。

＆＃13;

const first = document.querySelector("[data-pos=first]");
const second = document.querySelector("[data-pos=second]");

const all = Array.from(document.querySelectorAll("*"));

function firstElement(element1, element2) {
  return all.indexOf(element1) < all.indexOf(element2) ?
    element1 : element2;
}


const found = firstElement(second, first);

found.style.backgroundColor = "yellow";

＆＃13;

<div>test 1</div>
<div>test 2</div>
<div>test 3</div>
<div>test 4</div>
<div data-pos="first">test 5</div>
<div>test 6</div>
<div>test 7</div>
<div>test 8</div>
<div>test 9</div>
<div data-pos="second">test 10</div>
<div>test 11</div>
<div>test 12</div>

＆＃13;

检查哪个元素在另一个元素之前的函数

1 个答案: