CODEWITHSUNDEEP
htmlfirebugfirefox-developer-tools
user1717828
user1717828

Reputation: 7225

How do I use Firebug's or Firefox DevTools' inspector to view just one element?

I can delete a single <div> element by selecting it in Firebug's HTML panel or within the Inspector panel of the Firefox DevTools and pressing Del, but is there a way to delete all elements except one?

Upvotes: 1

Views: 197

Answers (1)

pbrosset
pbrosset

Reputation: 749

I don't really see a use case for deleting all HTML elements except one, but there are several ways you could do that in Firefox DevTools:

  • Select each element one by one in the tree and press Del each time.
  • Or select the root node, right-click, and select the "Edit as HTML" contextual menu, then in the editor box that appears, remove the HTML you don't want to see anymore, and submit (`Cmd/Ctrl+Enter)

Doing this however may end up removing a lot of the styling applied to the remaining element, and it may not appear as it originally was after you do this.

Maybe what you want to do instead is "isolate" an element visually in the page so that it's the only one that's visible anymore. If so, there's no feature in devtools to do this, but it's easily achievable by adding some CSS in the Style-Editor panel. Assuming the element you want to isolate has the id "my-id", you could do this:

* { visibility: hidden; } #my-id { visibility: visible; }

Upvotes: 2

Related Questions