Flexible application of JS debugging techniques to solve style problems share _javascript skills

In this case, debug becomes a headache for a variety of reasons, such as complicated code logic, long time forgetting processing details, or simply taking over changes to other people's legacy bugs.

In this sharing some JS debugging skills, for a variety of difficult and incurable diseases, often can play a better effect.

Step 1: Check what the server directly render out

By using a view of the source file, this step begins by clarifying whether the page HTML fragment is not normal on the server side.

Step 2: Compare the difference between the actual HTML content and the original content of the server render

You can use some front-end tools (such as developer tools under IE, Firebug, chrome developer tools, and so on) to view current HTML fragment content in real time

Step 3: Add debugger in the right place

For example: First find the likely problem of JS code, in the appropriate place to add debugger, or use the tool to increase similar to "when the property is modified to break" breakpoint, for example, the actual HTML than the original content of a width attribute

Step 4: Run your page, go into the interrupt, and check the JS call stack (the critical one)

It is recommended that you use the Visual Studio debugger supported by IE (you need to set ie: Cancel "Disable script debugging"), and then basically determine which JS method modifies the style