IE8 developer tools allow the web development client to debug smoothly

I downloaded IE8 and used it for a while. I didn't pay too much attention to the functions of IE8's developer tools. I tried it a little and found that IE8's developer tools are really good. It can greatly improve the efficiency of client development and debugging.

I will explain my use of IE8 developer tools from three aspects: HTML elements, CSS and JavaScript.

1. HTML element. Now we use the development tool of IE8 to select an HTML element. The outline of the element is displayed on the page and the child element is displayed, what's more convenient is that we can directly see the display of the running style of this element in browser parsing. What's more incredible is that we can change the enabling or disabling some styles at runtime, and see the Browser display without this part of the style. After talking about several good functions, do you believe it or not? Textures are evidence:

You can see that I have selected the H1 tag, and then the H1 element is marked with a blue circle on the page, in addition, the right pane of the tool displays the CSS style inherited from the parent element and its own style. You can also select the tracking style next to the style to enable or remove the definition of a style, and instantly display the Display Effect of the style, which is very convenient and effective for us to adjust the HTML and CSS styles of the page.

If you think it is not enough, there are more ways to use it, you can select the development tool's "View" and "outline" menu to display the DIV layout or table cells on the page, and use the "outline" menu function, the layout of the page is clear at a glance.

2. All of us who do web development know that client debugging is an important part of JavaScript debugging. In particular, web, JavaScript, and crab are as rampant as they are. The javascript debugging tool of IE8 can be comparable to the client debugging function of vs2008. With IE8, we can easily debug JavaScript on any page using our notebook instantly. Please refer to the figure below:

Select a script on the left-side Tab Of the debugging tool to view the script on the page. You can also view all the referenced script files on the page and set the breakpoint at will, in its upper-right corner, there is a script search function, which is very convenient and can display all breakpoints, local variables, monitoring, and so on. In this case, the IE8 web script is used for debugging.

In addition, the IE8 development tool can also separately clear the client cache of a site and separately clear the cookies of a site.

The development tool of IE8 is very useful. Let's try it.

The reference site for this article is: Baby pregnancy calendar, a website focusing on pregnancy.