Three.js 是一款运行在浏览器中的 3D 引擎，你可以用它创建各种三维场景，包括了摄影机、光影、材质等各种对象。你可以在它的主页上看到许多精采的演示。Three.js是一个伟大的开源WebGL库，WebGL允许JavaScript操作GPU，在浏览器端实现真正意义的3D。 Three.js的核心五步就是： 1.设置three.js渲染器 2.设置摄像机camera 3.设置场景scene 4.设置光源light 5.设置物体object 1.设置three.js渲染器 三维空间里的物体映射到二维平面的
最近一直在研读 jQuery 源码，初看源码一头雾水毫无头绪，真正静下心来细看写的真是精妙，让你感叹代码之美。 其结构明晰，高内聚、低耦合，兼具优秀的性能与便利的扩展性，在浏览器的兼容性（功能缺陷、渐进增强）优雅的处理能力以及 Ajax 等方面周到而强大的定制功能无不令人惊叹。 另外，阅读源码让我接触到了大量底层的知识。对原生JS 、框架设计、代码优化有了全新的认识，接下来将会写一系列关于 jQuery 解析的文章。 我在 github 上关于 jQuery 源码的全文注解，感兴趣的可以围观一下。jQuer
1.driver.current_url：用于获得当前页面的URL 2.driver.title：用于获取当前页面的标题 3.driver.page_source:用于获取页面html源代码 4.driver.current_window_handle:用于获取当前窗口句柄 5.driver.window_handles:用于获取所有窗口句柄 6.driver.find_element_by***** 定位元素，有18种 7.driver.get(url):浏览器加载url。 8.driver.forward()：浏览器向前（点击向前按钮）。 9.driver.back()：浏览器向后（点击向后按钮）。 10.driver.refresh()：浏览器刷新（点击刷新按钮）。 11driver.close()：关闭当前窗口，或最后打开的窗口。 12.driver.quit():关闭所有关联窗口，并且安全关闭session。 13.driver.maximize_window():最大化浏览器窗口。 14.driver.set_window_size(宽，高)：设置浏览器窗口大小。 15.driver.get_window_size()：获取当前窗口的长和宽。 16.driver.get_window_position()：获取当前窗口坐标。 17.driver.get_screenshot_as_file(filename):截取当前窗口。 18.driver.implicitly_wait(秒)：隐式等待，通过一定的时长等待页面上某一元素加载完成。若提前定位到元素，则继续执行。若超过时间未加载出，则抛出NoSuchElementException异常。 19.driver.switch_to_frame(id或name属性值)：切换到新表单(同一窗口)。若无id或属性值，可先通过xpath定位到iframe，再将值传给switch_to_frame() driver.switch_to.frame(id或name,或定位到的frame) 20.driver.switch_to.parent_content():跳出当前一级表单。该方法默认对应于离它最近的switch_to.frame()方法。 21.driver.switch_to.default_content():跳回最外层的页面。 22.driver.switch_to_window(窗口句柄)：切换到新窗口。 23.driver.switch_to.window(窗口句柄):切换到新窗口。 24.driver.switch_to_alert():警告框处理。处理JavaScript所生成的alert,confirm,prompt. 25.driver.switch_to.alert():警告框处理。 26.driver.execute_script(js):调用js。 27.driver.get_cookies():获取当前会话所有cookie信息。 28.driver.get_cookie(cookie_name)：返回字典的key为“cookie_name”的cookie信息。 29.driver.add_cookie(cookie_dict):添加cookie。“cookie_dict”指字典对象，必须有name和value值。 30.driver.delete_cookie(name,optionsString):删除cookie信息。 31.driver.delete_all_cookies():删除所有cookie信息。
使用 html-docx.js、FileSaver.js 、wordexport文件
早起 JS操作不同浏览器的 API 没有标准，有严重兼容性问题，后来 W3C 制定了统一的操作网页内容的 API 标准 DOM，使用 DOM API 操作网页内容，几乎 100%兼容所有浏览器，它具有查找, 修改(内容,属性,样式), 添加, 删除的功能。
你是否遇到过这种情况：在css中设置了transition过渡动画，但使用时，却无效。
举例来说，这个网址http://www.example.com/dir/page.html协议是http://，
《微信小程序七日谈》系列文章： 本系列的文章并非初学教程，而是笔者在具体开发过程中遇到的问题以及部分解决方案。 上篇文章第一天：人生若只如初见简单记录了笔者初步上手开发微信小程序遇到的一些问题，其中提到了wxss的部分细节问题。这篇文章以笔者在开发小程序响应式UI当中遇到的一些问题为例，简单记录一下使用wxss为响应式开发带来的一些模式和思维上的改变。 rem的重定义 前端工程师对rem非常熟悉，rem是以html元素的font-size为基准的尺寸计量单位。rem方便了开发者对响应式UI的尺寸进行统筹管
<meta http-equiv="x-ua-compatible" content="IE=edge">
响应式设计通过检测视口分辨率，针对不同客户端在客户端做代码处理，来展现不同的布局和内容；
scrollIntoView对页面元素调用，会滚动元素的父容器，将该元素滚动到浏览器的可视区域
电脑版的商城昨晚做完了，今天赶着做手机端的，提到手机端的网站第一个想到的就是要 适应不同手机屏幕的宽度，保证在不同手机上都能正常显示给用户，我之前做这类网站都是无脑引进bootstrap的。但前一个项目做完之后我发现bootstrap虽好，但里面的各种样式我利用的很少，最多用到它排版，当网站最后上传的时候你会发现，即使压缩之后，它也会占用相当大的一部分，所以这次我想自己用原生写，响应式开发（我现在知道的尚浅）目前我了解有
此篇文章主要实现两个功能： 1、点击屏幕下方签到悬浮按钮； 2、弹出幸运大转盘，转盘抽奖签到 效果如图： 在网上找了很多移动端拖拽的js实现方式，大部分都是这一种，html5的touch事件，但是
目录 一、前言 二、正则表达式的使用诉求 三、java.util.regex包 四、java.lang.String实例 五、最短路径实现诉求 六、Java支持的正则表达式功能语法 七、总结 八、参考 一、前言 正则表达式作为文本处理的利器，早已成为各大语言的必要装备，但各语言对其的实现程度（功能语法支持程度）和API设计均有所差异，本篇将目光投向java原生类库中提供的正则表达式API
最近挖的坑有点多，金库有点捉襟见肘。三年的腾讯云眼看也要到期了，本来打算是卖点硬件实现自给自足，因为懒的原因，好像并不是很成功，（只是多了一堆板子和趁手的工具）所以给网站加了点GoogleAds。 但在投放广告后发现，当访客使用手机访问时，Adsense自适应广告的宽度会展开为设备全宽。也就是说，广告宽度超过了父元素的宽度，就像下图所示：
在我本地测试当中： 在IE、FireFox、Opera下都可以使用 document.body.clientWidth document.body.clientHeight 即可获得，很简单，很方便。 而在公司项目当中： Opera仍然使用 document.body.clientWidth document.body.clientHeight 可是IE和FireFox则使用 document.documentElement.clientWidth document.documentElement.clientHeight 原来是W3C的标准在作怪啊
利用JS来控制页面控件的显示和隐藏有两种方法，两种方法分别利用HTML的style中的两个属性，两种方法的不同之处在于控件隐藏后是否还在页面上占空位。
开通 谷歌广告联盟 Google AdSense 后，当访客使用手机访问时，谷歌自适应广告的宽度会展开为设备全宽，使得广告宽度超过了父元素的宽度，如下图所示：
测试样本 为什么jq 使用$（selector）就能够获取DOM呢 原生的js该怎么实现 //事实证明通过如下方式不管传入的是id选择器还是class选择器都是可行的 document.querySelectorAll(selector) 获取DOM中的第几个元素 // 因为我们获取到的是一个NodeList数组，那么当然可以通过下标获取（注意不要越界） document.querySelectorAll(selector)[0] 给元素添加class // 添加完毕以后查看DOM结构的class中就
<meta name="viewport" content="width=device=width,initial-scale=1,user-scalable=0">
具体来说，有的屏幕320px宽，有的屏幕640px宽，有的更宽，如果你写固定px，那么要么小的放不下，要么大的有大片空白。
前言 《CSS魔法堂：重新认识Box Model、IFC、BFC和Collapsing margins》中提到在没有floated兄弟盒子时，line box的左右边框会与所属的containing block的左右content edge相接触。那到底什么是containing block(abbr. CB)呢？ containing block在CSS的visual formatting model中十分重要的理论基础，因为盒子的宽/高度自动值/相对值的计算，相对/浮动/绝对定位，均依赖conta
经常看到一些网页的导航栏点击切换时，不仅改变当前样式，同时下划线会跟随鼠标点击的标签栏缓慢滑到相应位置，那么这个简单而又好看的效果是如何实现的呢？
微信小游戏属于微信小程序的一个类目，小游戏对比于普通的h5游戏，其很大的一个特点是微信提供的关系链数据的使用，你可以获得同玩这个游戏的微信好友的数据，或者你在某个群的用户数据
有时候会做一些小的宽度变换, 比如居中到居左的变换, 例如上面的搜索的placeholder
https://blog.csdn.net/chenmozhe22/article/details/80035871
本文通过介绍如何利用flex和letter-spacing实现过渡动画效果，以及介绍一些实现动画的方式。同时，文章还讨论了如何利用flex实现居中效果，以及如何利用letter-spacing实现宽度改变时字母间距不变的效果。但是，文章也提到了一些缺陷，例如中文和英文的宽度不同，需要使用不同的letter-spacing值，以及动画时间不可控等问题。此外，文章还介绍了一种通过改变容器宽度来实现过渡动画的方法，但是这种方法也存在一些缺陷，例如需要使用will-change属性来减少paint范围等。总的来说，这篇文章提供了一些实现过渡动画效果的技巧，但是需要根据具体情况进行选择。"
实现的方案有很多，比如：PhantomJS，Selenium WebDriver，HtmlUnit，Puppeteer等，大致的思路都是在服务端静默的模仿打开浏览器，从而进行截图。 由于服务端一般使用java，本次实现的方案是使用java + PhantomJS + rasterize.js
Responsive Web Page，响应式网页/自适应网页，即一个页面既可以在 PC 浏览器中浏览，也可以在手机、平板中浏览，并且配合不同设备有不同的响应结果，响应式网页的特点：
微信小程序：wx.navigateTo中url无法跳转问:链接 微信小程序布局之行内元素和块级元素:链接 小程序端JS加密，传输PHP端解密:链接 小程序开发干货技巧：如何为你的微信小程序:链接 Flask中获取小程序Request数据的两种途径:链接 微信小程序，新添加的元素保持在底部:链接 微信小程序登录页动画 - 云层漂浮:链接 微信小程序swiper滑动页面实践-类似于安卓V:链接 微信小程序--下拉菜单(带动画)实现:链接 小程序request接口的封装，实现给循环列表:链接 微信小程序-文字
一、懒加载 1.什么是懒加载 目前，网络上各大论坛，尤其是一些图片类型的网站上，在图片加载时均采用了一种名为懒加载的方式，具体表现为，当页面被请求时，只加载可视区域的图片，其它部分的图片则不加载，只有这些图片出现在可视区域时才会动态加载这些图片，从而节约了网络带宽和提高了初次加载的速度。 2.懒加载的原理 页面中的img元素，如果没有src属性，浏览器就不会发出请求去下载图片，只有通过javascript设置了图片路径，浏览器才会发送请求。 懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位，
源码分析： Dropdowns.scss：下拉框模块 Javascripts/bootstrap/dropdown.js：实现下拉框响应 实现功能及原理： 下拉选项卡，默认不能实现显示选中项的功能 原理： 1、利用dropdown类作为定位点，然后让子级的列表dropdown-menu绝对定位实现，还需要加一个单击点作为设置data-toggle=”dropdown”才能做关联。 2、 需要js插件的支持 源码分析： 1、caret：实现向下的三角形，利用边框实现的 1.1、边框颜色默认是字
jquery为一种库，属于最基础的一个库，伴随着h5的到来，很多jquery的规则直接融入到了规则本身了，直接使用原生的js也能达到相同的目的。虽然如此，不过依旧要继续。
你还在用rem弹性布局吗？在html文件头部放入一大段压缩过的js代码，是不是让你很难受？来了解下vw吧，能让你的代码更纯粹。
jQuery对象的text()和html()方法分别获取节点的文本和原始HTML文本
移动端布局中，童鞋们会使用到rem作为css单位进行不同手机屏幕大小上的适配。那么来讲讲rem在其中起的作用和如何动态设置rem的值。
特点： 1. 弱类型 2. 基于对象。(因为面向对象需要具有封装、继承、多态的特征)
一、最最基本的 CSS顶部, JS底部 YUI compressor/Gzip CDN 有 必要的CSS Sprite Ajax可缓存 以上没什么好说的。 二、CSS渲染、页面重绘以及回流 尽量避免类似.a.b{}.list a{}以及其他一些复杂选择器，以提高整站整体CSS渲染。 避免某些expression表达式，避免IE6的AlphaImageLoader png透明滤镜，可以试试使用fireworks生成png8 alpha透明（目前photoshop只有png8 索引透明）。 适当定高，例如如果d
轮播图是我们常见的一种表现形式，通常，图片之间要做到无缝衔接循环需要花一些功夫，而小程序提供的组件就已经可以实现。可以说省去了开发者不少的时间。所以，今天我们要一起来学习以下几件事：
在上一篇教程《WebGL简易教程(八)：三维场景交互》中，给三维场景加入了简单的交互，通过鼠标实现场景的旋转和缩放。那么在这一篇教程中，综合前面的知识，可以做出一个稍微复杂的实例：绘制一张基于现实的地形图。
------------------------------------盒子模型常用的八个属性--------------------------------- Js盒子模型 Js盒子模型指的是通过js提供的一系列的属性和方法，获取页面中元素的样式信息值 client系列(当前元素的私有属性) clientWidth/clientHeight:内容的宽度/高度+左右/上下填充，（和内容溢出没有关系） clientLeft:左边框的宽度(borderLeftWidth) clientTop:上
最近项目中入手了一个非常实用的插件，这里和大家一起分享下：通过canvas实现图片裁剪的工具--cropper.js
上篇文章：https://blog.csdn.net/qq_23853743/article/details/108034430
现如今，我们处于一个信息碎片化的信息时代，遇到好的文章都有随手收藏的习惯。但过一段时间，当你想要重新查看这篇文章的时候，发现文章已经被移除或莫名其妙地消失了。
CSS 布局本质就是控制元素的位置和大小。比如这样的布局：元素宽960px，水平居中。宽960px是大小。水平居中是位置。又如这样的布局：两个元素在一行，左侧元素固定宽200px，右侧元素撑满剩余空间。固定宽200px，撑满剩余空间是大小。两个元素在一行是位置。
rem是什么？l rem是一种新的单位，是一个相对单位，类似于em。 不同的是rem的基准是相当于html元素的字体大小
来源：子慕大诗人 http://www.cnblogs.com/1wen/p/6839779.html 今天我讲的主题是css，具体聊一下我大概的css学习历史，分享一些干货，希望这次分享对大家有所启发和帮助。 个人的css历史 说说自己的css学习的历史，12年，当时是老师手把手1对1教我div+float的固定布局，所有元素全部用float，做了学生会网站的全部前端页面，因为有段时间学PS比较多，也是自己做的UI，很丑，老师说第一次做成这样很不错了，那时老师就觉得我有做前端的天赋，我就是从这个时候开始接
E:\MyProjects\TMP\frontend>npm install html2canvas
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
