在WebBrowser控件中highlight鼠标指向的网页元素 (C# Code)

最近做实验需要数据, 数据需要labeling, labeling需要tool, 于是需要做个类似于山寨版的Element Inspector或者FireDebug的小东东... 一开始想直接在WebBrowser上用System.Drawing画框框, 结果总是被WebBrowser控件盖住, 遂用hack HTML的方法搞定之, 即直接向HtmlDocument对象注入HtmlElement, 达到highlight网页元素的目的. 引用Microsoft.mshtml库, 调用IHTMLElement接口, 便可以方便地设置DIV style.

比较麻烦的地方是DIV的定位. 尝试过使用cursor.ClientRectangle的各种属性都失败了. 后来发现cursor.OffsetRectangle属性可以用, 但它仅用来表示当前节点和其parent节点间的相对位置, 因此需要递归 (或循环) 向上查找父节点直到根节点, 并累加这些offset, 从而得到最终的position. 代码整理了一下放在下面.

另一个需要注意的地方是zIndex这个属性,  MSDN Library的解释是"stacking order of positioned objects", 其实就是网页元素的层叠属性, 设置一个很大的值 (例如代码中的2012), 即可避免需要highlight的DIV被其他元素覆盖.

本文在 BY-NC-SA 3.0 版权协议下发布, 转载请注明出自 zhangyuyu.com .

Share this
Share on FacebookTweet about this on TwitterShare on Google+Email this to someone