Javascript 按大小获取元素

我必须获得一个大小为300x250的HTML页面中的所有元素（尽管只是父元素。因此，如果一个DIV是300x250，并且在同一维度中有一个图像，我将只获得DIV）

我不能使用jQuery或其他类似的框架，我的想法是：

循环页面中的所有元素，检查它们的维度（糟糕，不喜欢）

使用XPath（有没有办法通过XPath按宽度和高度过滤？）

---

你们知道更好的方法吗？

你们还没有说你们感兴趣的是哪个

宽度
或
高度
。当然，如果文档中有具有
width
或
height
属性的
img
元素，则XPath可以选择它们（例如
//img[@width='300'和@height='250']
）。但是像
div
元素这样的容器元素没有这样的属性，通常您可以访问它们的
offsetWidth
/
offsetHeight
DOM属性。据我所知，这些属性无法在XPath表达式中访问，因此XPath只能帮助选择某些元素，然后需要访问XPath计算返回的任何DOM元素节点的
offsetWidth
/
offsetHeight
属性。所以这个答案主要是关于XPath请求的

根据目标浏览器的不同，您可能可以使用
TreeWalker
或
NodeIterator
您不需要遍历页面上的所有元素（例如
querySelectorAll（“*”）
）。事实上，考虑到您需要具有正确大小的第一个祖先节点的要求，这样做会更加困难

然而，@MartinHonnen是正确的：无法使用XPath提取
或其他灵活大小元素的
越界
。您必须遍历元素并测试它们

我会使用广度优先或深度优先遍历，当发现分支的大小正确时，或者当分支的大小变得太窄或太短时，会对其进行修剪。这将大大提高您的性能

下面是代码的草图（未经测试）：

函数findElementsBySize（w，h）{
发现的var=[]；
递归查找（document.body）；
发现退货；
函数递归查找（el）{
如果（el.offsetWidth==w&&el.OffsetWight==h）{
发现。推（el）；
}else if（标高偏移宽度>=w和标高偏移视线>=h）{
对于（var i=el.childNodes.length；i--；）{
递归查找（el.childNodes[i]）；
}
}
}
}
？？？