首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端常用插件

seajs: 前端模块加载器,解决模块化、依赖等问题 jQuery-One-Page-Nav: 单页应用中一个用于处理导航栏的库 js.js: Javascript 实现的 javascript JIT...Javascript 语法错误的库, Facebook 出品 zoomooz: jQuery 插件,用来处理浏览器缩放 fancyBox: 一个用于放大缩小图片、Web 内容或者多媒体元素的库,优雅大方...的支持 jquery.scrollTo: 在页面上以一个元素为起始以动画的方式移动(ScrollTo)到另一个元素, 支持回退等 jScrollPane: 自定义的滚动条,让所有浏览器都显示一样的滚动条...onepage-scroll: 提供类似于 iPhone6 展示页类似的效果,适用于单页应用,兼容到 IE8 scrollMonitor: 前端插件用来监控元素的滚动事件(进入、退出等),性能很好 ScrollMagic.../Node 等支持 PhotoSwipe: JS 的一个图片展示库 focusable: 是页面上一个元素高亮的库,有图有真相 firefox.html: Firefox 在浏览器端的实现 —— HTML

4.7K61

8个用于编写可维护,简化的前端代码的CSS策略

2.可以把你的css写成可重用的组件 不要将CSS元素视为每个单独页面上的元素,如果您可以定义可重用的CSS的组件以供自己使用,则可以减少很多复杂性。...你在流行的框架中看到的一些例子是: 例如,使用.hide,而不是每次只需要在页面上写出一个元素就写出一个新的类,你可以在你的元素上加上.hide类,它会使元素显示display: none; 。...我们开发一个新的网站,一般都抽取旧网站的公共文件,因为这些文件可以减少为每个元素写出特定样式的需求。 通过一个很好的例子就是我们如何使用margin和padding盒子模型。...5.利用BEM防止嵌套 一个能够真正防止过度嵌套的策略是名为BEM(Block Element Modifier)的命名策略。...在谈论JavaScript或jQuery插件时,我会说,对于那些与您使用的任何组件都有很好集成选项的真正常见组件来说,情况也是如此。

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

    前端面试那些坑

    (加 for 或 包裹) HTML5的form如何关闭自动完成功能? 如何实现浏览器内多个标签页之间的通信? (阿里) webSocket如何兼容低浏览器?...如何在页面上实现一个圆形的可点击区域? 实现不使用 border 画出1px高的线,在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。...怎么实例化这个类 JavaScript中的作用域与变量声明提升? 如何编写高性能的Javascript? 那些操作会造成内存泄漏? JQuery的源码看过吗?能不能简单概况一下它的实现原理?...(阿里) 移动端最小触控区域是多大? jQuery 的 slideUp动画 ,如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行,该如何处理呢?...我们给一个dom同时绑定两个点击事件,一个用捕获,一个用冒泡,你来说下会执行几次事件,然后会先执行冒泡还是捕获 其他问题 原来公司工作流程是怎么样的,如何与其他人协作的?如何夸部门合作的?

    2.2K60

    前端工程师面试题汇总

    (加 for 或 包裹) HTML5的form如何关闭自动完成功能? 如何实现浏览器内多个标签页之间的通信? (阿里) webSocket如何兼容低浏览器?...如何在页面上实现一个圆形的可点击区域? 实现不使用 border 画出1px高的线,在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。...(阿里) 移动端最小触控区域是多大? jQuery 的 slideUp动画 ,如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行,该如何处理呢?...我们给一个dom同时绑定两个点击事件,一个用捕获,一个用冒泡,你来说下会执行几次事件,然后会先执行冒泡还是捕获 其他问题 原来公司工作流程是怎么样的,如何与其他人协作的?如何夸部门合作的?...答案是通过探测鼠标移动的方向和轨迹,具体查看Khan Academy工程师 Ben Kamens 写的 jQuery插件 文档推荐 jQuery 基本原理 JavaScript 秘密花园 CSS参考手册

    2.1K80

    前端插件以及部分细分网址梳理

    , 但是会延迟执行,某些场景下,性能会有很大的提升 seajs: 前端模块加载器,解决模块化、依赖等问题 jQuery-One-Page-Nav: 单页应用中一个用于处理导航栏的库 js.js: Javascript...这个插件提供了对早期 IOS4/5 和 Android 的支持 jquery.scrollTo: 在页面上以一个元素为起始以动画的方式移动(ScrollTo)到另一个元素, 支持回退等 jScrollPane...: 自定义的滚动条,让所有浏览器都显示一样的滚动条 onepage-scroll: 提供类似于 iPhone6 展示页类似的效果,适用于单页应用,兼容到 IE8 scrollMonitor: 前端插件用来监控元素的滚动事件...api使用移动设备的功能。.../Node 等支持 PhotoSwipe: JS 的一个图片展示库 focusable: 是页面上一个元素高亮的库,有图有真相 firefox.html: Firefox 在浏览器端的实现 —— HTML

    5.7K90

    Bootstrap运用终极指南

    Bootstrap是一个功能强大的、以移动端为优先的响应式前端框架,它是用CSS、HTML和JavaScript构建的。与从零开始编程,甚至许多其他框架相比,Bootstrap都有许多优势。...你可以将特定的bootstrap元素和已有的CSS代码一起使用。 如何选择和安装Boostrap? 下载Boostrap主要有两种版本: 编译版本或源码版本。...Flippant.js 是一个迷你的JavaScript和CSS类库,用于翻转页面元素,与其他类库没有依赖关系,便于自定义使用。 27....Typeahead.js 是一个来自Twitter的JavaScript库,用于构建typeaheads。 31. X-editable 插件支持在Bootstrap中的页面上创建可编辑元素。...StrapPress 是一个WordPress主题,它以移动为优先,响应性强,包含了大量的Bootstrap元素。 28.

    4.2K11

    【第3期】前端常用插件、工具类库汇总

    它能够处理任何元素,例如图片或者DOM元素 WebSlides:https://webslides.tv/#slide=1 用HTML来实现网页版的PPT和宣传展示页。...拥有两个版本,无依赖的独立版和react版本。除了Dom对象,也可监听Canvas内元素的手势。...二维码 jQuery qrcode:https://github.com/jeromeetienne/jquery-qrcode 是一个能够在客户端生成矩阵二维码的jQuery插件,使用它可以很方便的在页面上生成二维码...spectrum:http://bgrins.github.io/spectrum/ 支持移动端的,超小的颜色选择器。不用大量的图片、也不需要其他插件,同时支持自定义。...简单了解Easy Mock使用方法,可以参考如何使用Easy Mock,直接看文章中给出的视频连接即可。

    4.4K10

    JavaScript 学习-35.jQuery 基础语法与事件

    前言 jQuery 是一个轻量级的”写的少,做的多”的 JavaScript 库。...极大地简化了 JavaScript 编程 jQuery 库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改...> 入口函数 为了防止文档在完全加载(就绪)之前运行 jQuery 代码,即在 DOM 加载完成后才可以对 DOM 进行操作。...入口函数: window.onload = function () { // 执行代码 } jQuery 入口函数与 JavaScript 入口函数的区别: jQuery 的入口函数是在 html...}) }); 但是通过id定位的元素,只会绑定第一个,因为一般id在页面上具有唯一性,不要重复,通过id查找的元素,只返回第一个 点我 <button

    2K10

    jQuery设计思想

    jQuery是目前使用最广泛的javascript函数库。 据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库。微软公司甚至把jQuery作为他们的官方库。...在Google里搜索"jQuery 培训",此书排在第一位。jQuery官方团队已经同意,把此书作为官方教程的基础。 这本书虽然是入门教材,但也足足有100多页。...这是它区别于其他Javascript库的根本特点。 使用jQuery的第一步,往往就是将一个选择表达式,放进构造函数jQuery()(简写为$),然后得到被选中的元素。...五、元素的操作:移动 jQuery设计思想之五,就是提供两组方法,来操作元素在网页中的位置移动。一组方法是直接移动该元素,另一组方法是移动其他元素,使得目标元素达到我们想要的位置。...除了元素的位置移动之外,jQuery还提供其他几种操作元素的重要方法。

    2.2K60

    web 编写优秀 CSS 代码的 8 个策略

    为了防止这篇文章太长,我今天将主要讨论CSS代码。JavaScript代码是另一个完全不同的棘手问题。 这篇文章的目的不在于规则手册,而在于你正在编写CSS时的指南。...2.将CSS看作可重用组件 不要将CSS元素视为每个单独页面上的特定表单或元素,如果你可以定义可重用的CSS实用程序和组件以供自己使用,则可以减少很多复杂性。...我们写了一些实用程序文件,这些文件在应用程序之间共享,使用一些常用的实用程序可以减少为每个元素编写特定样式的需求。 一个很好的例子是我们如何使用margin和padding实用程序。...5.利用BEM防止嵌套 能够真正防止过度嵌套的一个策略是名为BEM(Block Element Modifier)的命名策略。...在谈论JavaScript或jQuery插件时,我要说的是,对于任何你使用的具有很好集成选项的真正常见组件来说,情况也是如此。其中的一些例子是照片轮播的JavaScript转盘,或日期选择器。

    2.3K00

    新手学习web前端的基础知识内容有哪些

    然而,市面上饱和的大多数是初级的职位,对于中高级开发工程师,企业还是很欢迎的。 作为初级程序员,必须逐步明晰自己的发展方向和道路,如果永远停留在自己心理舒适区,就注定永远改变不了。...优秀的大前端人才应该具备熟练编写任何一个互联网系统的前端页面、交互代码的能力,新手学习web前端的基础知识内容有哪些 HTML+CSS:HTML、CSS基础、div+css布局 JavaScript基础...网页制作。...移动Web开发:跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、Zepto.js、手机聚划算页面、手机滚屏。...HTTP服务和AJAX编程 WEB服务器基础:服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍。

    1.8K30

    看不完的那种!前端170面试题+答案学习整理(良心制作)

    19.如何设置css3文本阴影 h1 {text-shadow: 水平阴影,垂直阴影,模糊距离,阴影颜色} 20.如何把元素从左侧移动50像素,从顶端移动100像素 div{ transform: translate...39.jquery或zepto源码有哪些地方觉得不错 jquery源码封装在一个匿名函数的自执行环境中,有助于防止变量的全局污染。...42.jQuery中有哪几种常见的选择器 基本选择器;层次选择器;过滤选择器;属性选择器;子元素选择器;表单选择器;内容选择器;可见选择器 43.使用jQuery将页面上所有元素边框设置为2px宽的虚线...image 重绘: 当盒子的位置、大小以及其他属性,例如颜色、字体大小等都确定下来之后,浏览器便把这些原色都按照各自的特性绘制一遍,将内容呈现在页面上。...如何给jQuery动态添加新的元素,如何给新生产的元素绑定事件 jQuery的html()可以给当前元素添加新的元素。直接在元素还未生成前就绑定事件肯定是无效的,因为所绑定的元素目前根本不存在。

    11.5K50

    编写优秀 CSS 代码的 8 个策略

    为了防止这篇文章太长,我今天将主要讨论CSS代码。JavaScript代码是另一个完全不同的棘手问题。 这篇文章的目的不在于规则手册,而在于你正在编写CSS时的指南。...2.将CSS看作可重用组件 不要将CSS元素视为每个单独页面上的特定表单或元素,如果你可以定义可重用的CSS实用程序和组件以供自己使用,则可以减少很多复杂性。...我们写了一些实用程序文件,这些文件在应用程序之间共享,使用一些常用的实用程序可以减少为每个元素编写特定样式的需求。 一个很好的例子是我们如何使用margin和padding实用程序。...5.利用BEM防止嵌套 能够真正防止过度嵌套的一个策略是名为BEM(Block Element Modifier)的命名策略。...在谈论JavaScript或jQuery插件时,我要说的是,对于任何你使用的具有很好集成选项的真正常见组件来说,情况也是如此。其中的一些例子是照片轮播的JavaScript转盘,或日期选择器。

    1K60

    【JS】218-JavaScript简史:从网景到前端框架三巨头

    尽管 JavaScript 最初只是一个浏览器脚本语言,但是近几年,我们已经能够明显看到它在不断地演变:在桌面端、移动设备和服务端 Web App 领域都有所发展。...4. jQuery 为了使得 JavaScript 更简单,就衍生出了 jQuery。2006 年,John Resig 引入 jQuery 来去除共用性和重复性的任务。...DOM 模型表示页面上的元素(如标签)。使用 jQuery 能轻松的选择及操作这些元素。 JS 和 jQuery 的区别如下所示。...Angular 是一个面向单页应用程序的前端框架。目前约有 24%的 JavaScript 开发人员使用 Angular。更有趣的是,该框架在前端 JS 框架中排名第三。...Vue.js Vue.js 是第二受欢迎的 JS 框架,全球使用它的网站超过 64k。它构建于其他框架之上,比如 Angular。

    76430

    求职 | 史上最全的web前端面试题汇总及答案2

    如果需要使用iframe,最好是通过javascript动态给iframe添加src属性值,这样可以绕开以上两个问题。 20、如何实现浏览器内多个标签页之间的通信?...注意quirks:Safari 在无痕模式下设置localstorge值时会抛出 QuotaExceededError 的异常。 21、如何在页面上实现一个圆形的可点击区域?...2、Javascript与jQuery有什么区别? jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单。 3、在jQuery中如何注册事件?...通过val()便可以获取input的值 把节点元素名加上作为参数调用jQuery方法便可创建新节点,如:jQuery(“”)。 5、如何向页面插入节点?...②垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量。如果一个对象的引用数量为 0(没有其他对象引用过该对象),或对该对象的惟一引用是循环的,那么该对象的内存即可回收。

    6.1K20

    Python爬虫(十九)_动态HTML介绍

    v=201601150944"> jQuery jQuery是一个非常常见的库,70%最流行的网站(约200万)和约30%的其他网站(约2亿)都在使用。...一个网站使用jQuery的特征,就是源代码里包含了jQuery入口,比如: javascript" src="https://statics.huxiu.com/w...jQuery可以动态地创建HTML内容,只有在JavaScript代码执行后才会显示。如果你使用传统的方法采集页面内容,就只能获得JavaScript代码执行之前页面的内容。...比如页面上的按钮只有当用户移动鼠标之后才出现,背景色可能每次点击都会改变,或者用一个Ajax请求触发页面加载一段内容,网页是否属于DHTML,关键要看有没有用JavaScript控制HTML和CSS元素...那么,如何搞定? 那些使用了Ajax或DHTML技术改变/加载内容的页面,可能有一些采集手段。

    1.6K50

    成为一名专业的前端开发人员,需要学习什么?

    在最基本的层面上,JS用于创建和控制诸如实时更新的地图,交互式电影和在线游戏等内容。...jQuery jQuery是一个JavaScript库:一组插件和扩展,可以更快,更轻松地使用JavaScript进行开发。...jQuery不是必须从头开始编写所有代码,而是让前端Web开发人员为项目添加现成元素,然后根据需要进行自定义(知道JavaScript如此重要的一个原因)。...由于如此多的CSS从项目到项目的完全相同的元素开始,所以为您预先定义所有这些元素的框架是非常有价值的。大多数前端开发人员工作列表都希望您熟悉这些框架的工作方式以及如何使用它们。...所以,假设您添加了一个自定义的jQuery插件,突然有一半的其他代码中断了。您可以回滚到以前的版本,然后使用其他解决方案再次尝试,而不是必须加密手动撤消它并修复所有错误。

    1.3K20

    浅谈Google蜘蛛抓取的工作原理(待更新)

    浅谈Google蜘蛛抓取的工作原理 什么是爬行器? 爬行器如何工作? 爬行器如何查看页面? 移动和桌面渲染 HTML 和 JavaScript 渲染 什么影响爬行者的行为?...如何知道谷歌是否以移动第一的概念抓取和索引您的网站?您将在谷歌搜索控制台收到特别通知。 HTML 和 JavaScript 渲染 Googlebot 在处理和渲染笨重代码方面可能会遇到一些问题。...注意:如果你的网站充满了大量的JS元素,并且你不能没有它们,谷歌建议 server-side rendering(服务器侧渲染)。这将使您的网站加载速度更快,并防止 JavaScript 错误。...X-Robots标签可用作HTTP 标头响应的元素,该响应可能会限制页面索引或浏览页面上的爬行者行为。此标签允许您针对单独类型的爬行机器人(如果指定)。...但是,您可以通过设置规范的URL来防止任何重复的内容问题。规范标签表示哪个页面应被视为"主",因此指向同一页面的 URL 的其余部分将不会索引,您的内容也不会重复。

    3.5K10

    【CSS——效果实现】自适应页面(蓝桥杯真题-5136)【合集】

    本题需要在已提供的基础项目中,使用 CSS 或者 DOM 操作达到 Menu 和内容页自适应的效果。.../js/jQuery.min.js">:引入 jQuery 库,方便后续使用 jQuery 进行交互效果的实现,如菜单的展开和收缩等。...display: none;:初始状态下,菜单是隐藏的,不会显示在页面上。 position: absolute;:将菜单容器的定位方式设置为绝对定位,使其可以脱离文档流,方便进行位置调整。...z-index: 1;:设置菜单容器的堆叠顺序为 1,使其显示在其他元素之上,避免被内容卡片遮挡。 3....菜单项样式(.menu li) .menu li { display: block; /* 菜单项独占一行 */ } 将菜单项的显示方式设置为块级元素,这样每个菜单项都会单独占据一行,适应移动设备屏幕的纵向布局

    6110
    领券