Debugging JavaScript In Microsoft Edge, you can use several common tools and methods to achieve the following: First, use the developer tool (DevTools) breakpoint to find the JS file in the Sources tab. Click the line number to set a breakpoint or add a debugger; statements are followed by using Console output information to view variables and error stacks. You can use console.table() to clearly display objects or arrays. Then, monitor network requests to view interface request headers, response data, status codes, etc. to troubleshoot interface problems. Finally, when debugging the mobile page, you can enable remote debugging on the computer edge://inspect page to connect to the same LAN for operation.
Debugging JavaScript is actually not difficult in Microsoft Edge. The key is to master several common tools and methods. Edge is based on the Chromium kernel, so its developer tools are similar to Chrome, but it also has its own characteristics. Let me talk about some practical debugging techniques below.

Break points with DevTools
This is the most basic and most commonly used debugging method. After opening the page, press F12
or right-click on the page to select "Check" and enter the DevTools interface. Switch to the Sources tab, find the JS file you want to debug, and click Set Breakpoint on the left side of the code line number.
- The page will automatically pause when it runs to the breakpoint position
- You can view the current variable value, call stack, scope and other information
- Step-by-step through the control buttons at the top (such as continuing, stepping, skipping, etc.)
If you are not sure which piece of code is wrong, you can add a debugger;
statement to the suspicious place, and it will automatically stop when refreshing the page.

Use Console to output information
Sometimes there is no need to break points, just output some variables or states to see if they meet expectations. At this time, you can use console.log()
, console.warn()
, console.error()
and other methods.
-
console.log()
outputs normal information -
console.warn()
displays warning message -
console.error()
outputs error message and displays stack trace
Tips: If you want to output objects or arrays, you can use
console.table()
to make the result clearer and easier to read.![]()
In addition, you can click on the filter on the right side of the Console panel and only look at the content of error or warning to facilitate quick positioning of problems.
Monitor network requests to troubleshoot interface problems
Many front-end bugs have wrong data from the interface, so you have to look at the Network tab page.
- Open the Network panel and refresh the page to see all requests
- Click on a request to see detailed information: request header, response data, status code, etc.
- If it is a POST request, you can also check whether the sent data is correct.
Common problems such as interface 404, 500 errors, and cross-domain problems can be discovered here as soon as possible.
Tips for debugging mobile pages
If you are debugging web pages on your phone, Edge provides a remote debugging function:
- Open Edge browser on your phone to access the target page
- Enter
edge://inspect
in Edge on the computer to make sure "Discover devices" is checked - After connecting to the same LAN on your phone, you should be able to see the device and page list
- Click "Inspect" to operate like local debugging
This method is particularly useful for troubleshooting compatibility or performance issues on real machines.
Basically that's it. Debugging JavaScript does not necessarily have to be done in one step. The key is to try more and observe more, and you can slowly see the rules.
The above is the detailed content of How to debug JavaScript in Microsoft Edge. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undress AI Tool
Undress images for free

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

Many times when we use computers, we will choose Edge to query the information we want, and when logging in to some websites, we need an account and password, but it is troublesome to enter it every time. How do we operate at this time? What about Edge automatically saving passwords? For those who don’t know, let’s take a look together. How to automatically save passwords in Edge 1. Open the software, click the three-dot "..." button in the upper right corner, and select "Settings" in the option list below. 2. In the window that opens, click the "Personal Information" option on the left. 3. Then find "Let me choose to save password" on the right and change

Microsoft Edge's drag-and-drop feature allows you to easily open links or text on web pages, which is both practical and time-saving. To use this feature, just drag and drop the link or text anywhere on the page. This article will show you how to enable or disable Super Drag and Drop mode in Microsoft Edge. What is Super Drag and Drop mode in Microsoft Edge? Microsoft Edge has introduced a new feature called "Super Drag and Drop" that allows users to simply drag and drop links to quickly open them in a new tab. Just drag and drop the link anywhere in the Edge browser window. Edge will automatically load the link in a new tab. In addition, users can also

How to set up right-click menu in Edge? Edge browser is a browser software launched by Microsoft. It is also used by many friends, and we often use the right-click menu function during use. However, many friends still do not know how to use it. How to set the right-click menu, then let’s take a look at the method of setting the right-click menu in Edge with the editor. Users in need should not miss it. How to set up the right-click menu in Edge Method 1 First, open the Edge browser and click the "..." button in the upper right corner. 2. Then open the "Settings" below, as shown in the picture. Next, enter "right-click" in the search bar at the top of the game interface and click the search button. This way you can find the setting options in the right-click menu. square

What should I do if the memory usage of Edge browser is high? The editor has found that many friends now like to use Microsoft's Edge browser, because it is not only simple, but also can install various browser plug-ins. However, recently some friends have found that its CPU usage is very high when using Edge. , that is, the memory usage is too high. How to deal with this situation? Let’s take a look at the solution with the editor below. Solution to high memory usage in Edge 1. Close the tab and enter the edge browser and click the three dots in the upper right corner. Select "Extensions" in the taskbar. Just close or uninstall plug-ins you don't need. 2. Update the Microsoft Edge browser. Please make sure it is installed on your computer.

Recently, many friends have encountered lag when using the edge browser to watch site B videos in full screen, and the experience is very bad. So how to solve it? Let’s take a look at the detailed solutions below. Edge browser station B is stuck in full screen: 1. Open the browser and enter the URL about:flags. 2. Enter developer settings. 3. Click "Reset all logos to default" above. 4. Scroll down to the bottom and check "Enable Experimental JavaScript Features" to solve the problem.

What to do if edge pops up that Microsoft respects your privacy? Recently, some users have reported that the edge browser they use often pops up the message "Microsoft respects your privacy." Even if they click I accept, it will still appear next time they open the browser. So how do you close this annoying pop-up window? This problem should occur because the edge browser does not accept the cookie of the msn.cn website. The following editor will show you how to solve the problem that Microsoft respects your privacy pops up in edge. Try it and see if it helps. How to solve the problem that Microsoft respects your privacy when Microsoft respects your privacy in edge

Many users are dissatisfied with the white border around web pages in Microsoft Edge. They think it's unnecessary and distracting, and they're asking Microsoft to remove Microsoft Edge's bezels entirely. This is similar to the saying "don't fix what's not broken", but Microsoft doesn't seem to have taken this into account. Of course, it's a popular web browser that offers a variety of features, including a built-in ad blocker, tracking prevention, and a password manager. However, some users may find that the browser has a border around web pages. This border can be distracting or unsightly, and there are several ways to remove it. In a lengthy conversation on r/Edge, some regular non-internal users discovered,

How to install crx file in Edge browser? The Crx file is a browser extension application plug-in, and the plug-in format of many browsers is Crx, even the Edge browser is no exception. So how do we install the crx file for the Edge browser? In fact, this operation is very simple. Let’s take a look at the specific operation method with the editor. How to install crx files in Edge 1. First open the edge browser and click on the address bar at the top. 2. Enter "edge://flags/#extensions-on-edge-urls" in the address bar and press Enter. 3. After entering, change the icon option to "Disabled". 4. After modification is completed, click
