首页
学习
活动
专区
圈层
工具
发布

chrome插件开发教程

越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率。...JavaScript Errors Notifier 安装该扩展后,会在Chrome地址栏中以图标形式提示JavaScript错误,因为Chrome默认只有打开console才会显示错误。...Window Resizer 此扩展可以调整浏览器窗口的大小,以适应各种屏幕分辨率。这对于Web设计师和开发者非常有用,可以帮助他们在不同的屏幕分辨率下测试网站布局。...这是一个开发者最喜欢的Firefox扩展Firebug的精简版。 JQuery 扩展 jQuery扩展让你在当前网页中运行JavaScript和jQuery命令。...IE Tab 在Chrome中打开IE浏览器标签页,你可以打开一个标签来运行Internet Explorer,让你看到的网页在IE浏览器看起来如何。

2.4K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    来自1000多个项目的10大JavaScript错误浅析

    在Chrome里读取未定义对象的属性或调用未定义对象的方法时就会发生这个错误,在Chrome开发者控制台可以很容易地重现这个错误。...这个错误与发生在Chrome里的是差不多的,只是Safari为它提供了不同的错误信息。 3....有意思的是,在JavaScript里,null和undefined其实是不一样的,所以我们会看到两个不同的错误消息。undefined表示未赋值的变量,而null表示变量值为空。...TypeError: Object doesn’t support property 在IE里读取未定义对象的属性或调用未定义对象的方法时就会发生这个错误,在IE开发者控制台可以很容易地重现这个错误。...在Rollbar命名空间中,可以直接使用this关键字来调用这个方法: this.isAwesome(); 在Chrome、Firefox和Opera中这样做都是没有问题的,但在IE中就不行。

    10.3K80

    前端开发中不可忽视的知识点汇总(一)

    2、文件可能已经被加载过并保存有缓存 一些通用的js库或者是css样式库,如jQuery,在网络中的使用是非常普遍的。...当一个用户在浏览你的某一个网页的时候,很有可能他已经通过你网站使用的CDN访问过了其他的某一个网站,恰巧这个网站同样也使用了jQuery,那么此时用户浏览器已经缓存有该jQuery文件(同IP的同名文件如果有缓存...(在13年发布的Chrome 28.0.1469.0版本开始,Chrome放弃Chromium引擎转而使用最新的Blink引擎(基于WebKit2——苹果公司于2010年推出的新的WebKit引擎),Blink...简述一下你对HTML语义化的理解? 用正确的标签做正确的事情。...png24位的图片在iE6浏览器上出现背景,解决方案是做成PNG8. 浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;}来统一。

    91120

    都9102年了,还需要用到 jQuery 吗?

    它通过易于使用的API在大量浏览器中运行,使得 HTML 文档遍历和操作、事件处理、动画和 Ajax 变得更加简单。...旧浏览器的工作方式是完全不同的,因为没有标准的处理方式,开发人员必须进行多次检查以确保 JavaScript 在IE、Firefox、Opera、Safari 和 Chrome 中正确运行。...在一些简单的或普通的网站中,性能缓慢几乎不会引起注意,并且可能是为了更多功能所做的折衷,但是在每一毫秒都很重要的大型复杂网站中,jQuery 一般会降低此类网站的性能。...要想在不同浏览器中支持你的应用或网站,以及在旧版浏览器上工作,可以使用转换工具,例如Babel 将 ES6 代码转换为与浏览器兼容的代码,可以在 polyfills 的帮助下通过浏览器了解特定功能以及其他工具...jQuery 与现代前端库和框架进行比较 jQuery 被较少使用的一个主要原因是 JavaScript 库和框架(例如ReactJS、AngularJS 和 VueJS)的兴起,在本节中我们将看看它们的区别

    2.9K40

    10 种最常见的 Javascript 错误

    当你读取一个未定义的对象的属性或调用其方法时,这个错误会在 Chrome 中出现。 您可以很容易的在 Chrome 开发者控制台中进行测试(尝试)。 ?...您可以在 Safari Developer Console 中轻松测试。这与 1 中提到的 Chrome 的错误基本相同,但 Safari 使用了不同的错误消息提示语。 ? 3....有趣的是,在 JavaScript 中,null 和 undefined 是不一样的,这就是为什么我们看到两个不同的错误信息。...这相当于 Chrome 中的 “TypeError:”undefined“ is not a function” 错误。 是的,对于相同的逻辑错误,不同的浏览器可能具有不同的错误消息。...ReferenceError: event is not defined 当您尝试访问未定义的变量或超出当前范围的变量时,会引发此错误。 您可以在 Chrome 浏览器中轻松测试。 ?

    11.6K80

    1000个项目中前10名的JavaScript错误介绍

    当你读取一个未定义的对象的属性或调用其方法时,这个错误会在 Chrome 中出现。 您可以很容易的在 Chrome 开发者控制台中进行测试(尝试)。...您可以在 Safari Developer Console 中轻松测试。这与 1 中提到的 Chrome 的错误基本相同,但 Safari 使用了不同的错误消息提示语。 3....有趣的是,在 JavaScript 中,null 和 undefined 是不一样的,这就是为什么我们看到两个不同的错误信息。...这相当于 Chrome 中的 “TypeError:”undefined“ is not a function” 错误。 是的,对于相同的逻辑错误,不同的浏览器可能具有不同的错误消息。...ReferenceError: event is not defined 当您尝试访问未定义的变量或超出当前范围的变量时,会引发此错误。 您可以在 Chrome 浏览器中轻松测试。

    10.8K10

    JS魔法堂:那些困扰你的DOM集合类型

    document.getElementsByName在Chrome和FF30.0中返回NodeList(木有namedItem方法的),在IE全系列中都返回HTMLCollection,吐血了吧?   ...由于document.getElementsByName在不同的浏览器中返回不同类型的对象,因此推荐使用[{Number} 索引]的方法来访问集合元素会省心一些;  4....三、同名不同性——IE下怪异的HTMLCollection                  假如大家看过《JS魔法堂:追忆那些原始的选择器》,应该会了解到在IE5678下,document.all会返回一个类函数对象...NamedNodeMap和HTMLCollection、NodeList不同,因为它是无序集合,虽然可以通过数字类型的下标索引访问NamedNodeMap集合中的元素,但该索引值并不真实代表元素在集合中的位置...另外,JQuery中也有一个data函数,那么它跟以"data-"开头的自定义特性有什么关联呢?

    2.5K90

    第168天:json对象和字符串的相互转换

    json对象和字符串的相互转换 1、json对象和字符串的转换 在Firefox,chrome,opera,safari,ie9,ie8等高级浏览器直接可以用JSON对象的stringify()和parse...中也有将字符串转为JSON格式的方法jquery.parseJSON( json ),接受一个标准格式的 JSON 字符串,并返回解析后的 JavaScript (JSON)对象。...34 比如$.parseJSON('{"testing":"1\t2\n3"}'),大多数实现中将抛出一个错误,因为JavaScript分析器直接转换字符串的制表符和换行符为文本的制表符和换行符...39 40 在jQuery 1.9之前,如果传递给$.parseJSON一个空字符串,null, 或者 undefined,,将返回null,而不是抛出一个错误...字符外包裹一对小括号  注:ie8(兼容模式),ie7和ie6也可以使用eval()将字符串转为JSON对象,但不推荐这些方式,这种方式不安全eval会执行json串中的表达式。

    2K10

    Sentry(v20.12.1) K8S 云原生架构探索,SENTRY FOR JAVASCRIPT 故障排除

    Dealing with Ad-Blockers 当您使用我们的 CDN 时,广告拦截(ad-blocking)或脚本拦截(script-blocking)扩展程序可能会阻止我们的 SDK 无法正确获取和初始化...如果您的应用程序集成在其中,这也有助于防止跟踪任何父应用程序错误。在此示例中,我们使用 @sentry/browser,但它也适用于 @sentry/node。...Client 上设置的,如果你需要处理多个 clients 和 hubs,你必须确保也正确地进行集成处理。...如果您使用第三方库来实现 promises,则可能还需要管理您的配置。另外,请记住,浏览器经常实施安全措施,当提供来自不同来源的脚本文件时,这些措施会阻止错误报告。...Support for IE 11 在 5.7.0 版之前,我们的 JavaScript SDK 需要为旧版浏览器(如IE 11和更低版本)提供一些 polyfill。

    2K20

    jQuery 事件绑定 和 JavaScript 原生事件绑定

    live、delegate 不多用,在Jquery1.7中已经移除,这里不多说 重点介绍 bind、on bind(event,[data],function) bind 是使用频率较高的一种,作用就是在选择到的元素上绑定特定事件类型的监听函数...JavaScript支持在标签中直接绑定事件 2.在JavaScript代码中onXXX绑定:在JavaScript代码中绑定事件可以使JavaScript代码与HTML标签分离,文档结构清晰,便于管理和开发...在JavaScript代码中onXXX绑定 在JavaScript代码中绑定事件的语法为: elementObject.onXXX=function(){     // 事件处理代码 } 其中: elementObject...addEventListener() 是标准的绑定事件监听函数的方法,是W3C所支持的,Chrome、FireFox、Opera、Safari、IE9.0及其以上版本都支持该函数; 但是,IE8.0及其以下版本不支持该方法...jQuery 中的事件绑定具有叠加性,JavaScript 的事件绑定则是可覆盖的。

    7K20

    前端开发面试题

    DOCTYPE>声明位于HTML文档中的第一行,处于 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。...常规布局是基于块和内联流方向,而Flex布局是基于flex-flow流可以很方便的用来做局中,能对不同屏幕大小自适应。 在布局上有了比以前更加灵活的空间。...*jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。 *jQuery UI则是在jQuery的基础上,利用jQuery的扩展性,设计的插件。...):请求包含错误语法或不能正确执行 400——客户端请求有语法错误,不能被服务器所理解 401——请求未经授权,这个状态代码必须和WWW-Authenticate报头域一起使用...5**(服务端错误类):服务器不能正确执行一个正确的请求 HTTP 500 - 服务器遇到错误,无法完成请求   HTTP 500.100 - 内部服务器错误 - ASP

    5.7K52

    前端知识普及之页面加载

    详见下述说明:(from 赖小赖小赖) // 获取 performance 数据 var performance = { // memory 是非标准属性,只在 Chrome 有 //...unload 或者前一个网页与当前页面不同域,则值为 0 unloadEventStart: 0, // 和 unloadEventStart 相对应,返回前一个网页...我们可以在Chrome的developer工具的network选项里面得到我们想要的答案....接下来我们要做的最后一件事,就是看看jquery老大哥,他的ready事件的原理到底是什么. jquery ready事件浅析 jquery主要做的工作就是兼容IE6,7,8实现DOMContentLoaded...我们来看一下jquery中实现doScroll的兼容: //低版本的IE浏览器,这里添加监听作为向下兼容,如果doScroll执行出现bug,也能保证ready函数的执行 document.attachEvent

    2K90

    【思考】为何弃用jQuery?(下)

    新标准的出现,加速了设计和开发不分家的局面中独立出来,且市场上也开始出现了新的声音“You Don't Need jQuery”。...《微软宣布在 1 月 12 日 起停止支持旧版本浏览器》这一则标题在开发者和媒体中掀起了一阵小高潮。...05 - 2018 微软从 2015 年就将 Edge 作为 IE 的新内核预置在 WIN10 系统中,然而让 IE 死亡的行动从未停止。2018 年 3 月 微软宣布登陆iPad和安卓平板。...最后的结语 而如今开发者和浏览器对于 jQuery 的依赖程度越来越低,那么 jQuery 的未来会像 IE 一样衰亡然后退出历史的舞台吗?...我想 jQuery 并不会很快的失去它的光辉,在国内环境中还是拥有大量的老旧系统在使用着 IE 浏览器,至少还保证了 jQuery 在国内环境中还是占有一席之地,但这也不是应该乐观的因素。

    1.8K30

    深入解析AJAX的原理

    = new XMLHttpRequest(); //IE7+,Firefox,Chrome,Opera,Safari }else{ request = new ActiveXObject("...,不会校验json是否合法,会直接执行json中的js语句 var jsonObj=JSON.parse(jsonData);//推荐 Jquery中的$.ajax([settings]) type:类型...,“POST”或“GET”,默认“GET” url:发送请求的地址 data:是一个对象,连同请求发送到服务器的数据 dataType:预期服务器返回的数据类型,一般为json,若不指定jquery将根据...当协议、子域名、主域名、端口号中任意一个不相同时,都算作不同域。 方法一:后端代理 方法二:JSONP(支持get,不支持post) 在www.bbb.com页面中--> jsonp({'name':"洪七公","age":70})  方法三:HTML5提供的XHR2(ie10以下版本不支持) 服务端增加如下(PHP) header

    1.5K40

    8 款浏览器兼容性测试工具介绍,需要的赶紧收藏吧!

    为此,我们可以在多台计算机或者多台虚拟机上部署不同浏览器进行测试,但这种方法会造成一定的资源浪费、或存在卡顿情况。为提高测试效率,可以利用一些浏览器兼容性测试工具来完成测试工作。...2、BrowserShots 网址:http://browsershots.org/ BrowserShots 是一款免费的在线跨浏览器测试平台,捕捉网站在不同浏览器中的截图。...种浏览器,覆盖所有旧版本的 Internet Explorer(IE6 - IE11),最新测试版和开发版(Edge,Safari,Chrome,Firefox,Opera 和 Yandex)以及各种真实的...不仅是在 Chrome 上,这个插件还在 Firefox、Safari、Internet Explorer、Edge、Android Chrome 和 iOS Safari 上截图。...也可以在真实的设备和浏览器上,运行各种 Selenium 和 Appium 类型的脚本。可免费试用。

    10K30

    JavaScript第八弹——Ajax快到碗里来

    现在我们再来具体介绍一下XMLHttpRequest 对象吧~ 所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject)。...创建方式就是: var xmlhttp; if (window.XMLHttpRequest){ // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 xmlhttp...(); 一般使用get或post比较多,这里也会涉及到get与post的比较: get:与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。...基于jQuery的Ajax 对于日常开发中,我们可以采用jQuery所封装的Ajax,达到更高效的开发: ?...会报跨域错误,怎么系统解决跨域错误,且听下回分解~~而且http也是前端开发的小伙伴们很重要的工具,我们后面也会有专题讲到的!

    68110

    2018年,JavaScript都经历了什么?

    与Webpack,使用JS文件配置; overrides:允许同一个项目使用不同的Babel配置,例如前端代码的targets为Chrome 60,而后端代码的targets为Node 8; ... [...这样可以防止同事使用jQuery方法。 使用原生代码重写了2个依赖于jQuery的模块jquery-pjax和facebox。...开发一个定制的jQuery版本,一旦完全移除某个jQuery方法,就删除jQuery中的对应代码。这样既可以减少jQuery大小,也可以防止同事使用已经移除的jQuery方法。...根据用户统计数据,来逐步放弃支持低版本的IE浏览器,这样的话可以无需依赖jQuery来保证兼容性。 ......是否使用jQuery各有各的想法和需求,但是GitHub弃用jQuery的流程非常专业,可以作为处理技术债的标准规范。

    90650

    前端开发中不可忽视的知识点汇总(二)

    this总是指向函数的直接调用者(而非间接调用者);如果有new关键字,this指向new出来的那个对象;在事件中,this指向触发这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象...跟 async不同, defer scripts在整个文档里的script都被下载完才顺序执行。 46. JQuery一个对象可以同时绑定多个事件,这是如何实现的?...306——前一版本HTTP中使用的代码,现行版本中不再使用 307——申明请求的资源临时性删除 4**(客户端错误类):请求包含错误语法或不能正确执行 400——客户端请求有语法错误,不能被服务器所理解...属性请求 412——一个或多个请求头字段在当前请求中错误 413——请求的资源大于服务器允许的大小 414——请求的资源URL长于服务器允许的长度 415——请求资源不支持请求项目格式 416——请求中包含...5**(服务端错误类):服务器不能正确执行一个正确的请求 HTTP 500 - 服务器遇到错误,无法完成请求   HTTP 500.100 - 内部服务器错误 - ASP 错误 &emsp

    2.3K40
    领券