Javascript-emulation chrome-debugger's highlighting

我想知道是否有人曾經這樣做過 - 我希望能夠模擬chrome調試器（或任何其他瀏覽器調試器）通過懸停來突出顯示渲染元素的能力/選擇其代碼等效元素。Javascript-emulation chrome-debugger's highlighting

例如，我有以下佈局：

頂部部分是這使得一個示例HTML頁面IFRAME元素，和底部部分被嵌入在瀏覽器的代碼編輯器（ace ），它顯示iframe內容的HTML代碼。我希望能夠通過將其相應的HTML代碼元素懸停在代碼編輯器中來突出顯示iframe中的HTML元素。

有沒有人有任何想法如何實現這樣的事情？我想聽聽一些有趣的方向。

謝謝！

2015-11-29 gipouf

-1

我想

谷歌瀏覽器檢查元素

可以做的工作

如何使用檢查元素

右鍵點擊任何網站，並點擊最後一個檢查元件（一個等待一段時間）。

然後開發人員工具將彈出html。您可以將鼠標懸停在開發人員工具中的這些代碼上，並在懸停時突出顯示網站元素，並且突出顯示的顏色與填充，邊距和元素本身的顏色不同。比你還做了很多鍍鉻開發工具，如編輯風格和DOM功能

更多，檢查你的CSS類，請檢查您的大小

如需進一步信息

This is official site。

如果你想扭轉鉻 Chrome DevTools App

2015-11-29 23:22:51

我想效仿這一功能 – gipouf

@royv所以，你應該接近與逆向工程谷歌瀏覽器的仿真。我會在答案中加入有用的鏈接。 –

回答