推荐几个我常用的Chrome插件 —— 让你使用Github效率翻倍 Chrome 可以说是全世界最受欢迎的浏览器了，其快速、稳定的性能，简洁的设计以及多平台同步的功能都深受用户的推崇，然而很多人成为他的忠粉还是因为它强大的拓展性...我个人安装了非常多的 Chrome 插件，这些插件可以在使用浏览器的各个方面帮助我提升效率，今天就推荐一些 Github 相关的 Chrome 插件。...下载方式：Chrome 商店搜索 OctoLinker GitHub Hovercard 这款插件可以让你在使用 GitHub 的时，很多地方都能弹出悬浮窗，快速显示大量信息。...下载方式：Chrome 商店搜索 GitHub Hovercard 下载 crx 如果你不能访问外国网站，不用担心，我已经把这些插件帮你下载好了，公众号后台回复 chrome 即可获得下载链接...我是用的下面这个网站下载 crx 的，只需要输入插件在 chrome 商店的 url 即可：https://chrome-extension-downloader.com/
以下文章来源于code秘密花园 ，作者ConardLi 推荐几个我常用的Chrome插件 —— 让你使用Github效率翻倍 Chrome 可以说是全世界最受欢迎的浏览器了，其快速、稳定的性能...我个人安装了非常多的 Chrome 插件，这些插件可以在使用浏览器的各个方面帮助我提升效率，今天就推荐一些 Github 相关的 Chrome 插件。...下载方式：Chrome 商店搜索 OctoLinker GitHub Hovercard 这款插件可以让你在使用 GitHub 的时，很多地方都能弹出悬浮窗，快速显示大量信息。...下载方式：Chrome 商店搜索 GitHub Hovercard 下载 crx 如果你不能访问外国网站，不用担心，我已经把这些插件帮你下载好了，公众号后台回复 chrome 即可获得下载链接...我是用的下面这个网站下载 crx 的，只需要输入插件在 chrome 商店的 url 即可：https://chrome-extension-downloader.com/
.'); 使用这两个方法无法查找带伪类状态的元素，比如querySelector(':hover')不会得到预期结果。 querySelector 该方法返回满足条件的单个元素。...('.foo,.bar');//返回带有foo或者bar样式类的首个元素 querySelectorAll 该方法返回所有满足条件的元素，结果是个nodeList集合。...关于转义 我们知道反斜杠是用来转义用的，比如在字符串里我们想表示空字符就使用'\b'，换行'\n'。...先看个例子，比如我们有个div它的样式类为'foo:bar'，当然我知道你一般不会这样写。当我们需要选择它的时候，就需要将其中的冒号进行转义，否则抛错。...也就是说经历两次转义，一次是字符串当中，一次是querySelector解析参数时。 理解这点后，可以来看一个更有趣的例子了。比如我们要选择类名里面含反斜杠的元素。是的，我们需要一共使用四个反斜杠！
特别声明：我的桌面云，请遵守国际互联网安全使用桌面云相关的条款！！！！...西里网 - 我的桌面云支持的浏览器 安装说明： 1、下载压缩包：点击下载安装按钮下载对应的浏览器插件压缩包 2、压缩包解压：将下载的压缩包 browserExt.zip 解压 3、拖入浏览器：将解压文件拖入浏览器...，确认安装即可 我的桌面云下载地址如下： 我的桌面云官网：直接下载 chrome浏览器扩展：我的桌面云 ，干净桌面适合个人使用~~_哔哩哔哩_bilibili 以下是Chrome扩展程序的使用步骤教程...打开Chrome浏览器直接在地址栏输入：chrome://extensions 并按回车键跳转。 chrome://extensions/ 2....到此已完成部署，现在，可以正常使用了！ 6. 如何添加桌面图标方法：在桌面右单未，弹出菜单 7. 选择图标
像类似掘金插件又是怎么实现的，当我安装稀土掘金插件后，我的导航页都被改掉了，因此你也可以做一个类似的插件，来导航你公司的一些产品，方便快捷的实现你的内部导航 在开始本文之前，主要是从零认识一个chrome...": 3, // 扩展插件版本必须是2以上 "name": "Maic_test_chrome", // 扩展名称 "description": "lesson demo", // 扩展描述.../popup.js"> 当你打开浏览chrome://extensions/然后添加插件04-demo 在打开一个测试页面 我通过插件中的popup.js...与content.js通信，就可以修改我当前页面上的元素了 另外推荐一个chrome插件官方的例子chrome-extensions-samples[4]，看完一些例子多插件哟更深刻的认识，在下一节里，...的通信 chrome核心api,chrome.runtime.onMessage，chrome.runtime.sendMessage,chrome.tab.query的使用 本文示例code example
本文转载自趣说软件，禁二次转载 Chrome浏览器是目前世界上使用率最高的浏览器，由于Chrome浏览器性能强悍、速度流畅、安全稳定、丰富的扩展插件库等众多优点备受网友热爱，其中也有很大一部分网友使用...Chrome的主要原因在于它支持各类实用的扩展插件。...近期收到一些小伙伴们的私信让我推荐一些Chrome上比较好用的扩展插件，我总结了以下几个推荐给大家，当然大家没有必要把我推荐的全部安装上，选择自己需要的即可！...1、Stylus 很多小伙伴总是私信我，问我的百度搜索页面怎么变成这个样子的呀，没错就是使用的这款插件，它不仅仅支持更改百度的搜索页面，也支持其他众多的网站 关于谷歌浏览器的插件安装我不再多...插件安装完成以后，例如我们打开百度网页，然后点击浏览器右上方的插件图标，点击【查找更多样式】或者点击【查找适合此网站的更多样式】按钮，然后大家自己选择喜欢的点击使用即可，其他的网站大家自行去体验！
安全：可以使用正则自定义运行脚本的网站。 兼容性：编辑的脚本不仅可以在 Chrome 上运行，也可以借助 Greasemonkey 在火狐上运行，同时脚本支持 ES6。...Chrome 同步：您正在使用多个 Chrome 浏览器，一个家用，一个工作用？您希望您可以同步自己的脚本？那么，您仅需设置 Tampermonkey 的同步功能。...快速安装 如果浏览器是 Chrome 谷歌浏览器的话，并且具备访问外网的能力，直接访问这个链接下载： 谷歌插件市场 Tampermonkey 详情 如果不具备访问外网的能力，建议使用火狐浏览器来进行安装...这次做 Chat 我就不拿以前的那篇文章来做高级脚本编写的案例了，这次使用新的脚本，将慕课网的手记迁移到 CSDN 项目简称为 M2C（慕课到 CSDN）。 既然确定了效果，就想实现思路。...使用的是 CKEditor 版本 1.5.8 DEV，最新的是 5+。大家想想这编辑器到底有多老了，大家 F12 可以很清楚地看到大片带有 CKEditor 为 class 标签。
学习Three.js的时候,看到官方提供了很多很多的example,实在太多了,但并不是每个我都感兴趣,想去了解,但我又记不住每个链接对对应的效果是什么样的,于是我想,能不能把所有的案例用图片保存下来,...于是我准备写一个工具,这个工具可以批量将网页保存成图片或PDF并且生成对应的图片案例页面,或json数据 说干就干 因为对nodejs比较数据,于是就选择用nodejs+puppeteer来实现这个小工具...首先是获取所有的example链接 在控制台输入下面这段代码就会获取所有example的链接json数组 代码如下: let linkArr = [...document.querySelector(...x.href, name:x.innerText.replace(/\//g, '_',) } }) console.log(linkArr) 效果如图: 主程序代码如下 使用.../chrome-win/chrome.exe', // headless:false, defaultViewport :{width:1920,height:1080}}); const
世上浏览器千千万，唯 Chrome 独领风骚，Chrome 浏览器的另一个亮点就是它拥有强大的扩展插件，很多好用的功能都可以通过插件来使用，今天就给大家分享几个阿粉常用的 Chrome 浏览器插件，包含编程和阅读相关...想要使用的朋友可以去 Chrome 商店进行下载使用，如果打不开 Chrome 商店的话，可以在公众号后台回复：插件，阿粉已经帮大家下载好了，直接拿去用就好。...同样的，想要使用这个插件的可以去 Chrome 商店下载，如果下载不了的也可以在公众号后台回复：插件 获取。...学习相关 划词翻译 工作中难免会遇到一些单词不知道什么意思，或者想给变量起个英文名，或者在平常浏览一些 API 文档的时候看不懂，这个时候我们就需要一款翻译软件了，最好是那种很简单就可以使用，不需要中断我们现有的流程...更多好用的 Chrome 插件，欢迎大家在评论区留言，让阿粉也多使用使用。
独领风骚，Chrome 浏览器的另一个亮点就是它拥有强大的扩展插件，很多好用的功能都可以通过插件来使用，今天就给大家分享几个阿粉常用的 Chrome 浏览器插件，包含编程和阅读相关，如果你有更好用的浏览器插件...编程相关 JSON-handle 不管是不是 Java 程序员，日常工作中必不可少的会接触到 JSON 的使用，当我们做前后端对接的使用，很多时候的入参和出参都是 JSON 格式的数据。...GitHub 在看代码文件的时候只能一层层的找，然后再返回，使用的过程比较麻烦。...学习相关 划词翻译 工作中难免会遇到一些单词不知道什么意思，或者想给变量起个英文名，或者在平常浏览一些 API 文档的时候看不懂，这个时候我们就需要一款翻译软件了，最好是那种很简单就可以使用，不需要中断我们现有的流程...daily.dev daily.dev 是一个 Chrome 浏览器插件，安装过后在每次新打开标签的时候都可以看到下面的页面，daily.dev 主要是将很多高阅读和评论的文章展现出来，选取是很多平台上面的一些优质文章
用法 ---- 两个方法使用差不多的语法，都是接收一个字符串参数，这个参数需要是合法的CSS选择语法。...'selector1,selector2,...'); 使用这两个方法无法查找带伪类状态的元素，比如querySelector(':hover')不会得到预期结果。...按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找，返回第一个满足条件的元素 element = document.querySelector('div#container');...//返回id为container的首个div element = document.querySelector('.foo,.bar');//返回带有foo或者bar样式类的首个元素 querySelectorAll...document.getElementById返回的便是实时结果，上面对其添加一个子元素后，再次获取所有子元素个数，已经由原来的2个更新为3个(这里不考虑有些浏览器比如Chrome会把空白也解析为一个子节点
至于在 Deno中该如何使用 Puppeteer，如果您只是想简单运用，跟着Copy攻城狮的步伐就够了，如果您想深入了解，建议深入到源码中学习！...puppeteer常常被用来生成页面的屏幕截图和PDF、实现SSR、自动化测试等等，在业界也有不少企业级的运用，比如有赞商城前端团队使用puppeteer搭建统一海报渲染服务，TCB 的云函数也支持 puppeteer...于是也有开发者想在 deno 中使用puppeteer，就有了上图中的issue 。 deno-x-ranking puppetter 尽管有人排斥造轮子，但应该没人反对为了方便而使用轮子。...的疑问，我在 deno-x-ranking 上特意以 puppetter 进行了检索，这两个插件都是基于 puppetter 源码修改 -- “拥抱TS，拥抱 Deno”。...原本想从掘金的搜索入口入手，先从关键字搜索到用户列表，再从列表中的用户链接跳转到个人页，不过因为学艺不精被掘金的骨架屏难住了，另外我用的page.waitFor也报错了，因此暂时从useid入手，获取指定
作为互联网“入口”之争的战略高地，浏览器向来是巨头们决胜未来的重要砝码，同时也会大大的影响了用户的使用，本次的春运刷票浏览器插件全是清一色WebKit内核Google Chrome插件，让普罗大众近距离的体验...下面我使用的一个订票插件，这个插件目前还可以用的，只是铁道部已经约谈了各大浏览器的插件作者，这里我也不便多介绍，下面主要是想普及chrome的 crx插件 ?...Chrome的扩展文件的扩展名（后缀）为.crx,Google Chrome可以自动关联这种扩展名为.crx的文件。...事实上，当我们将crx文件使用winrar或者是7-zip等解压软件解开之后就可以发现，其中至少包含两个文件，一个文件是扩展名为.js的脚本文件，另一个是文件名为manifest.json的文件，部分可能还会包含一个...主文件取名manifest.json，用来描述这个扩展，包括扩展名字、版本、调用的文件、可用域等信息。
Hello，你好呀，我是灰小猿！一个超会写bug的程序猿！...最近某学妹在众多大佬的栽培下学到了不少东西， 虽然学妹没等到，但是等到可爱的女朋友来找我帮忙了，她居然说Android Studio自带的真机不好用，还想让我帮她在安卓虚拟机上浏览各位大佬的文章，看来女朋友已经不限于使用自己的电脑或手机来学习我文章中的知识了...， 女友一来，这哪能顶得住，我啪的就站起来了，很快啊！...然后上来就是一个左正蹬一个右边腿一个左刺拳，“啪”的我的电脑就打开了！ 上来我就打开了Android Studio就要手写代码，女友说：“这不行，真机调试老出问题，不能用自带的真机！”...我让她打开cmd命令行找到到“夜神模拟器”的安装目录，她居然要手动输入路径，这在一个程序员男友面前怎么行， 我先是找到“夜神模拟器”的安装路径“\Nox\bin”，一个CTRL+L，再输入一个“cmd”
后来我想，是不是可以模拟一个事件，再触发一次点击，然后代码是这样的： function mockEvent(fn) { var createDiv = document.createElement...然后我想，是不是setTimeout的原因，只要存在延迟的情况下就不行。结果我去这么试了一下，将之前的按钮直接点击方式改为200ms之后执行focus。...虽然点透事件在移动端会被处理掉，然而我只是想验证一下我的猜想。...4.2 解决方案 原因大致是：ios自带的输入居中效果，而带有fixed头部在页面被顶上去的同时没有重新计算位置，导致显示错误。...那么可以具体分这几步来解决： 没有focus的时候采用fixed固定头部 不要让用户进行缩放 当输入框focus时，采用绝对定位头部，同时使用window.pageYOffset来计算滑动的距离，设置头部的
在前端开发中，我们经常需要通过JavaScript选择页面上的特定元素。特别是当你需要在一个div元素内部选择一个带有特定类名的子元素时，掌握几种常用的选择方法是非常必要的。...本文将结合实际业务场景，带大家了解如何使用JavaScript选择div内部带有特定类名的元素。 1....使用 document.querySelector document.querySelector 是选择器API中最常用的一个，它允许你通过CSS选择器来获取DOM元素。...它通过ID直接获取一个元素，然后可以继续使用querySelector来获取该元素内的子元素。...使用 document.getElementsByClassName getElementsByClassName 方法可以返回所有带有指定类名的元素集合。
在下列情况下允许使用声音自动播放： 用户已经与域进行了交互（点击，tap等）。 在桌面上，用户的媒体参与指数阈值(MEI)已被越过，这意味着用户以前播放带有声音的视频。...您也可以决定禁止使用MEI以及默认情况下全新MEI获得播放自动播放的网站是否允许新用户使用，从而决定禁止播放自动播放。...，play()不带用户手势的调用将拒绝带有NotAllowedErrorDOMException 的promise。...Chrome企业政策 Chrome企业策略可以改变这种新的自动播放行为，以用于例如信息亭或无人值守系统。...关注播放函数返回的Promise。 var promise = document.querySelector('video').play(); if (promise !
.css-nvf2q2 { display: none; } ` document.head.appendChild(style) 可以有多种写法,如下 如果想使用CSS来隐藏或删除知乎私信...('.css-nvf2q2').innerHTML = '' 还可以直接移除该元素: document.querySelector('.css-nvf2q2').remove() 这些方法都是在内容脚本中添加...使用CSS会更轻量级一些,无需直接操作DOM元素。 利用CSS样式设置".css-nvf2q2"为不可见就可以很好地隐藏知乎私信icon了。...[2] 要在 Chrome 网上应用店中添加应用或扩展程序，先压缩文件所在的文件夹。然后，在 Chrome 网上应用店中进行发布[3]。...或 640x400)都有要求,需要相应调整,可以用这个[4] 详细可参考: 【Chrome 扩展开发】发布 Chrome/Edge 扩展到应用商店[5] 对于Edge浏览器的 发布流程，可参考官方文档
同样的，许多操作系统都有自己的某种语音合成系统，在这个任务中我们调用可用的 API 来使用语音合成系统。...UI 想跑这个例子，你可以 git clone Github 仓库中的部分 (或者直接下载[3])，在桌面版支持的浏览器打开 index.html 文件，或者在移动端浏览器直接导向 live demo...URL[4] ，像 Chrome 和 Firefox OS。..."); var rateValue = document.querySelector(".rate-value"); var voices = []; 填充 select 元素 为使用设备上可用的不同的语音选项填充...接下来，我们需要弄清楚使用哪种语音。使用 HTMLSelectElement[18] selectedOptions 属性返回当前选中的 ``[19] 元素。
在这篇文章中，我将介绍5个相对较新的CSS属性，你可能从来没有听说过，我觉得很有趣。 本文的目的是给你一个概述，它们是什么，你可以使用哪些值，它们的使用场景，还有一些例子。...） 在开始之前，我想提醒一下，当处理新的CSS属性时，总是一个好主意来检查他们的支持和潜在的跨浏览器问题。...在使用浏览器前缀的情况下， Chrome 49+，Firefox 46+和Opera 36+都支持这个属性。...使用它，您可以隐藏元素的特定区域。 最常见的用例是在该属性中使用图像，但是您可以比这更有创意，并使用带有段落的“clip-path”仅显示一部分内容。...如果您想了解更多信息，请查看 相关属性的支持，使用 clip-path,我推荐你用Chrome, 它支持最多。
云服务器
ICP备案
实时音视频
对象存储
云直播
