google-chrome-devtools

问题 In Chrome, Tools -> Developer Tools -> Elements tab. There are no line numbers next to the source code. Is there a way to toggle them on? 回答1: Don't know how useful it will be, but you can right click on the html element in the Elements tab, select "Copy as HTML" and paste the results in your favorite text editor. That will give you line numbers for the DOM as it exists at the point where you copy it. Like the comments point out, this will not correspond to source line numbers. 回答2: There is

问题 -When using the the option "toggle device scrollbar" in the Chrome inspector, whenever you type a new width / height the window zoom adjusts for that width/height automatically. This is incredibly frustrating UI, as I don't want the zoom to adjust... ever. The only way to avoid this is by resizing the responsive window by dragging the side borders. Is there a way to turn the auto zoom off? My current version of chrome: Version 54.0.2840.98 (64-bit) 回答1: I have had this issue a few times now.

问题 Can I save just specific requests in the Chrome Devtools Network tab? It would be very useful to me since our company uses web crawling to fetch info from extranets, and the most I can do is to record (with the rec button) all the requests made to reach for a specific info, and if I want to save the desired requests/responses in a file to analyze them later, all I can do is to save it all as a .har file, which saves EVERYTHING, including every resource (images, css, js, etc), filling the file

问题 Sometimes when I Inspect Element in Google Chrome I find that I have some large frames, but they are filled with white space. Anyone know what often causes such large amounts of empty space? I have seen timers cause issues with extending the frames length but in the example below I am unsure why a frame would be so large. Would love some help minimizing these 回答1: This is documented here, see the 'About clear or light-gray frames' section. 'Clear frames' in question are described there as

问题 Is there a way to hide the "XHR finished loading" messages in the console? 回答1: Yes, open the contextmenu in the console, and remove the check at Log XMLHttpRequests . You can still inspect the network traffic at the Network tab. 回答2: There is some workaround posted in chromium issue tracker http://code.google.com/p/chromium/issues/detail?id=15472 Which version of chrome you are using? In my console there is checkbox to enable or diable log XMLHTTPRequests I am using 17.0.963.79 来源： https:/

问题 Ever since Chrome updated itself to version 32, I have been experiencing aggravating bugs. One of the worst is when editing the DOM using the Web Inspector, and Chrome will about every minute start popping up this dialog, which yanks focus from the Web Inspector: It's complaining about the Web Inspector itself being "unresponsive", when it really isn't, and nothing's gone wrong. This particular page I'm messing with is making use of the mutation-summary library. Perhaps the bug in Chrome that

问题 unfortunately in the last versions of Chrome the negative network filter doesn't work anymore. I used this filter in order to exclude each http call containing a particular string. I asked a solution in Chrome dev tool forum but at the moment nobody answered. So I would like to know if there is a way to resolve this problem (and exclude for example each call containing the string 'loadMess') with regex syntax. Many thanks 回答1: Update (2018): This is an update to my old answer to clarify that

问题 It seems like something has changed lately with Chrome Dev Tools. Logging a jQuery object with console.log used to show the Element of the DOM node in the console. Something like this: [<a href="#employees">Employees</a>] Now it has changed to a clickable object like this: [<a>, context: <a>] Is there a way to go back to the old style of object logging or even a different method to call on console ? I'm currently using version 23.0.1271.64 . Not sure exactly which version brought the change.

问题 In Chrome DevTools, under Rendering, there's an option to "Show potential scroll bottlenecks". When I enabled this, some div elements I have on the screen with overflow:scroll show a flag at the top saying "repaints on scroll." I can't find a lot of documentation on this feature, and I don't know whether it's something I can actually fix or improve upon, or just a statement of fact - the divs have content, and they do indeed scroll. 回答1: You can apply this CSS on the div with overflow: scroll

问题 I like docking devtools to the right. I remember how happy I was when I first saw that option when I realized I no longer have to split screen and position windows manually. Recent versions of chrome that option seems to be missing. Even on my installs where I already have devtools on the right the option is removed. Where did it go? 回答1: If you click and hold on the icon in the top right next to the close icon (Undock into separate window button), you are given the option to dock it to the