如果元素存在于DOM中或者它是虚拟的(仅由createElement创建),如何使用javascript查找

我正在寻找一种方法来查找 javascript中引用的元素是否已插入文档中.

让我们用以下代码说明一个案例：

var elem = document.createElement('div');

// Element has not been inserted in the document,i.e. not present

document.getElementByTagName('body')[0].appendChild(elem);

// Element can Now be found in the DOM tree

Jquery有：可见选择器,但当我需要找到隐藏元素放在文档中的某个位置时,它不会给出准确的结果.

解决方法

这是一个更简单的方法,使用标准 Node.contains DOM API签入元素当前在DOM中：

document.body.contains(MY_ElEMENT);

CROSS-broWSER注意：IE中的文档对象没有contains()方法 – 为了确保跨浏览器兼容性,请使用document.body.contains(). (或者如果您正在检查链接,脚本等元素,则为document.head.contains)

使用特定文档引用与节点级ownerDocument的注意事项：

有人提出使用MY_ELEMENT.ownerDocument.contains(MY_ELEMENT)检查节点是否存在于文档中的想法.虽然这可以产生预期的结果(虽然在99％的情况下比所需的更多冗长),但它也可能导致意外的结果,具体取决于用例.我们来谈谈原因：

如果您正在处理当前驻留在单独文档中的节点,例如使用document.implementation.createHTMLDocument()生成的节点,则< iframe>文档或HTML导入文档,并使用节点的ownerDocument属性来检查您认为将是您的主要视觉呈现文档的存在,您将处于一个受伤的世界.

node属性ownerDocument只是指向节点所在的当前文档的指针.几乎包含的每个用例都涉及检查特定文档中是否存在节点.您有0保证ownerDocument与您要检查的文档相同 – 只有您知道. ownerDocument的危险在于有人可能会引入任意数量的方法来引用,导入或生成驻留在其他文档中的节点.如果他们这样做,并且您编写了代码以依赖ownerDocument的相对推断,那么您的代码可能会中断.为确保您的代码始终产生预期结果,您应该只与要检查的特定引用文档进行比较,而不是信任像ownerDocument这样的相对推理.