大家好，我是考100分的小小码 ，祝大家学习进步，加薪顺利呀。今天说一说手机网页前端调试面板怎么设置_网页调试页面,希望您对编程的造诣更进一步.
Eruda
Console for Mobile Browsers.
Why
Logging things out on mobile browser is never an easy stuff. I used to include window onerror alert script inside pages to find out JavaScript errors, kind of stupid and inefficient. Desktop browser DevTools is great, and I wish there is a similar one on mobile side, which leads to the creation of Eruda.
Demo
Browse it on your phone: liriliri.github.io/eruda/
In order to try it for different sites, execute the script below on browser address bar.
javascript:(function () { var script = document.createElement('script'); script.src="//liriliri.github.io/eruda/eruda.min.js"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();
Features
- Console: Display JavaScript logs.
- Elements: Check dom state.
- Network: Show performance timing, ajax requests status.
- Resource: Show localStorage, cookie information.
- Info: Show url, user agent info.
- Snippets: Include snippets used most often.
- Sources: Html, js, css source viewer.
- Features: Browser feature detections.
Install
You can get it on npm.
npm install eruda --save
Add this script to your page.
The JavaScript file size is quite huge(about 75kb gzipped) and therefore not
suitable to include in mobile pages. It’s recommended to make sure eruda is
loaded only when eruda is set to true on url(example.com/?eruda=true),
for example:
(function () {
var src = 'node_modules/eruda/dist/eruda.min.js';
if (!/eruda=true/.test(window.location) && localStorage.getItem('active-eruda') != 'true') return;
document.write('');
document.write('eruda.init();');
})();
Configuration
When initialization, a configuration object can be passed in.
- container: Container element. If not set, it will append a element directly under html root element.
- tool: Choose which default tools you want, by default all will be added.
var el = document.createElement('div');
document.body.appendChild(el);
eruda.init({
container: el,
tool: ['console', 'elements']
});
Plugins
It is possible to enhance Eruda with more features by writing plugins. Check
source code of plugins below to learn how to write your own custom tool panels.
- eruda-fps: Display page fps info.
License
Eruda is released under the MIT license. Please see
LICENSE for full details.
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
转载请注明出处: https://daima100.com/12954.html
