View Selection Source in IE

One of the features I like in Firefox as a developer is the "View Selection Source" option that you can choose  from the context menu to view dynamically rendered source of a desired portion of the web page. This feature helps you focus on a specific portion of a web page that you want to investigate instead of getting the entire HTML source.

IE 8's Developer Tools lets you view the HTML source for selected content as well but using it is cumbersome. After invoking Developer Tools (Tools > Developer Tools or F12 key) with the HTML tab open, you have to select an element in the DOM Explorer & then choose View > Source > Element Source with Style. That's about 5 steps compared to just a single step in Firefox.

Patrick Clancey has shared a bookmarklet that will let you view the HTML source of a selected portion of a web page within an alert window, in just a single step. Follow these steps to install the bookmarklet in IE 8:

• Scroll down to the bottom of this page.
• Right click on the link View Selection Source
• Select "Add to Favorites..."
• In the "Add a Favorite" dialog box that opens, select Favorites Bar from the dropdown opposite to label "Create in"
• Click on the Add button

From the menu, select View > Toolbars & select the Favorites Bar to see the bookmarklet appear below the address bar.

To use the bookmarklet, select the content you want to view the HTML source of and click on the View Selection Source bookmarklet. The source will show up in an alert window

Also see -
IE8 Developer Tools Tips & Tricks:
#6: Count links in a page
#5: Find Link Paths
#4: Edit CSS Visually
#3: Customize HTML Source Viewer
#2: Script Console
#1: Color Picker