作者：Ahmad shaded 译者：前端小智 来源：sitepoint 在本文中，我列出了十个我过去没用过的HTML5功能，但现在发现它们很有用，废话不多说，让我们开始吧。 ?...默认情况下，它是收起来的，打开后，它将展开并显示被隐藏的内容。...Map HTML 属性 与 属性一起使用来定义一个图像映射(一个可点击的链接区域)。可点击的区域可以是这些形状中的任何一个，矩形，圆形或多边形区域。...data-* 属性 data-*属性用于存储页面或应用程序专用的自定义数据。 可以在 JavaScript 代码中使用存储的数据来创建更多的用户体验。...代码部署后可能存在的BUG没法实时知道，事后为了解决这些BUG，花了大量的时间进行log 调试，这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。
在本文中，我列出了十个我过去没用过的HTML5功能，但现在发现它们很有用，废话不多说，让我们开始吧。 detais 标签 标签向用户提供按需查看详细信息的效果。...如果需要按需向用户显示内容，简单的做法就是使用此标签。默认情况下，它是收起来的，打开后，它将展开并显示被隐藏的内容。...Map HTML 属性 与 属性一起使用来定义一个图像映射(一个可点击的链接区域)。可点击的区域可以是这些形状中的任何一个，矩形，圆形或多边形区域。...可以在 JavaScript 代码中使用存储的数据来创建更多的用户体验。...感谢您对IT大咖说的热心支持！
1 Video介绍 引用我翻译文档《在HTML5页面中嵌入音频和视频》中的介绍文字：“当今，在网页上嵌入视频且所有用户不管使用任何浏览器或者操作系统都能看到的唯一可靠方法是使用Flash。...大多数用户已经安装了Flash插件（事实上，大概95%的上网用户都装有Flash的某个版本），但HTML 5的支持者正在推动一个开放的，不需要任何插件的视频标准。...这就是HTML 5的新标签带来的构想，他提供了一个嵌入视频（以及与其交互）而不需要类似Flash的私有插件的方法。 不幸的是，视频并非那么简单。...Opera、Mozilla、Chrome宣布将完全支持VP8，IE宣布部分支持（需要装一个插件，但如果我没记错的话，HTML5的一个愿景就是脱离浏览器插件，微软真是让人觉得悲剧）。...6 Video完结 W3C网站上有一个关于HTML 5视频的举例，很好的说明了所有前面介绍的标签的使用，属性和方法以及事件的应用，非常直观。
前言 A long time ago in a galaxy far, far away....微软在Silverlight Toolkit里提供了一个好用的VisualTreeExtensions，里面提供了一些查找...在那个时候(2009年)，VisualTreeExtensions对我来说正好是个很棒的Linq和扩展方法的示例代码，比那时候我自己写的FindChildByName之类的方法好用一万倍，所以我印象深刻...，日常中我常用到的，在Wpf上也没问题的就是以上的功能。...foreach (var item in this.GetVisualDescendants().OfType()) { } 3.使用问题 VisualTreeExtensions虽然好用...3.3 Popup的问题 Popup没有自己的Visual Tree，打开Popup的时候，它的Child和Window不在同一个Visual Tree中。
Python 开发者现在可以观摩下美国情报机构 NSA 是如何培训 Python 程序员的。...软件工程师 Chris Swenson 根据信息自由法案递交申请，要求访问 NSA 的 Python 培训材料，结果收到了 400 页经过编辑的 NSA COMP 3321 Python 培训课程打印资料...Python 开发者 Kushal Das 观摩之后摘录些有趣的细节：NSA 有内部的 Python 包索引，其 GitLab 实例是 gitlab.coi.nsa.ic.gov，为 CentOS、Red...大概只有 NASA 在使用 Linux 时，能不对 Debian 提供支持，相信下一个版本会提供的。
关于Message更多的信息请参考： http://www.w3.org/TR/html5/comms.html#dom-messageevent-initmessageevent https://developer.mozilla.org.../en/DOM/window.postMessage Message中一般常用的属性： 1、data 包含传入的消息，一般以会将传递的数据转化为字符串； 2、origin 返回消息来自的域，可以根据它来判断是否要处理消息...，位于同级目录（当然这两个文件可以放在不同的域中） 最终运行的实例效果如下图所示： ?...1: 2: 3: 4: 5: 6: 7: 关于HTML5...： postMessage的目标源文档必须填写（即第二个参数，第一个参数则提交的数据），它必须与iframe对象的所在的域匹配，如果不匹配将会抛出一个安全性错误，阻止脚本继续执行。
关于HTML5的基础，前一二年就已经有很多人写过很好的文章了。...HTML5-Canvas 关于HTML5 Canvas的基础教程 (原文HTML5 canvas - the basics) 在一些不支持flash的设备中，如果要使用网页需要对一些图表数据进行展示，...比如需要将股票价格的走势支持ipad、iphone等移动设备的访问，有一个基于prototype的插件可以满足类似的需求，官网网址>> 还有一个站点，针对canvas开发的一套完整的api，也是很强劲，...官网地址>> 尽管目前canvas只支持2d的图形，而且仅支持一种图形--矩形，但它的api是如此丰富，以致可以做出一些很吸引人的应用。...国外有一个网站，Simple 3D HTML5 canvas 有几个例子，3D效果都很逼真： http://sebleedelisle.com/demos/canvas3d/canvas3d2.html
配置包含主题，显示以及插件 防止 copy 的时候覆盖已存在的文件, 带上 i 选项，文件已存在的时候，会提示，需要确认才能 copy alias cp="cp -i" 【如果要一直生效，需要将命令添加到...install bat 修改主题，显示时间和当前文件路径vim ~/.zshrc #ZSH_THEME="robbyrussell" ZSH_THEME="ys" 修改history 命令的时间显示格式
114.114.114.114 114.114.115.115 114.114.114.119 114.114.115.119 Alibaba DNS: 223.5.5.5 223.6.6.6 另外是各地的运营商
从 Visual Studio 2005 开始有个非常好用的功能, 就是在 debug 的时候, 可以用Visualizer 很方便的查看某些类型的参数, 比如说 Text Visualizer, XML...Visualizer, HTML Visualizer 等等, VS2008还针对了 IEnumerable 类型对象也提供了查看的能力....WCF Visualizers 可以查看WCF的各种对象,是WCF开发的必备工具之一,WCF Visualizers 主要提供下列Visualizers: 1....(Vista User) 3、打开Visual Studio 2008 WCF 项目 4、在下列类型的对象上设置断点： 1. Message Class 2.
history在HTML4的时代里，有如下几个方法和属性，应该很熟悉： length、back()、forward()、go([delta]) 在HTML5中又添加了两个方法： pushState(data...更多内容可以参考： http://diveintohtml5.org/history.html http://dev.w3.org/html5/spec-author-view/history.html...rewrite ^/history/.*$ /html5/history/index.html last; } 页面访问路径是：http://meteoric.com/history/ ?...0; margin: 0; } HTML5...() { 68: if (typeof history.pushState === 'undefined') { 69: state.className = '当前浏览器不支持HTML5
1.广告终结者 用来清除网页上乱七八糟的广告，比如网站的竞价广告的显示，使自己想要的结果显示在前面。 ?...广告终结者.png 2.The Great Suspender 开很多页面时，用来释放很久没有浏览过的标签页，点击后再加载网页。 ?...The Great Suspender.png 3.JSONView 格式化json，如果是get请求，返回的json数据会结构清晰的显示在网页上。 ?...效果图.png 5.Imagus 添加后，将鼠标移到有图片链接的地方，就会显示图片大图。 ?...FireShot.png 7.Dark Reader 网页的黑夜模式。将网页的白底变成黑底，适合长时间看博客文章，找很久了。 ? Dark Reader.png
说明： username：创建登录用户名 host：指定该用户在哪个主机上可以登陆，本地用户可用localhost，如果想让该用户可以从任意远程主机登陆，可以使用通配符% password：该用户的登陆密码...，UPDATE……等，如果要授予所的权限则使用ALL databasename：数据库名 tablename：表名，如果要授予该用户对所有数据库和表的相应操作权限则可用*表示，如 *.* 举例： //对于...命令: //查看用户具备哪些权限 SHOW GRANTS FOR 'root'@'%'; 注意： 假如你在给用户'pig'@'%'授权的时候是这样的（或类似的）：GRANT SELECT ON test.user...FROM 'pig'@'%';命令并不能撤销该用户对test数据库中user表的SELECT 操作。相反，如果授权使用的是GRANT SELECT ON ....TO 'pig'@'%';则REVOKE SELECT ON test.user FROM 'pig'@'%';命令也不能撤销该用户对test数据库中user表的Select权限。
而HTML5中的FileReader对象与as3中的很像，只不过目前as3中的方法比这个多(有兴趣可以自己去看看adobe的lives docs，对比一下两者的区别与共同点)。...HTML5中允许选择多个文件： 只允许上传一个文件： 2、如何让用户只能上传指定的文件格式...我尝试着去寻找HTML5中是否也如as3中可以让开发者自定义过滤选择文件呢，结果被我找到了http://en.wikipedia.org/wiki/File_select 添加一个属性就好了accept...关于定义的配置规则，可以参考这一篇文章：nginx下php获取自定义请求头参数的方法 搜索了很多关于html5 upload的例子，有人用.net、ruby写了，但没有找到用php写的（有是有，不过是使用提交.../ 查了很久(已经很晚了，明天还得上班就不折腾了)，暂时放弃php的部分，有空再写完整的例子，重点是看File、FileReader的方法（实现了本地预览的功能） 本地运行的效果： ?
其比喻做没什么意义但又不忍舍弃的事情。 今天我们就来说说曾经遇到的各种鸡肋知识点。 HTML“肋” 最初，计算机其实是一个很高大上技术门槛很高的东西，是科学界的利器。...CSS“肋” 随着时代的发展，万恶的IE6终于退市了，市场份额占比渐渐少了，目前还有极少量的公司要求兼容IE6浏览器，但，渐渐的这些兼容需求会逐渐消失…… 对于IE6，利利的建议是，不要太纠结于每个bug...对于第一方面原因引发的问题，个人觉得没有什么太大的必要去研究了，而对于第二类问题，使IE6能够成为辅助我们检查自己代码质量的工具。...JS“肋” 其实，JS中的鸡肋知识是最多的，不知道在刷朋友圈或微博时有没有注意到时常会看到这样的标题:十种绚丽的大图滚动插件，二十种优秀的图表制图框架，八个值得你拥有的表单验证插件。...小编在此抛砖引玉了，希望各位都来说说自己遇到的鸡肋有哪些，也让其他小伙伴少绕一点弯路…… HTML5学堂小编-利利 耗时2h
HTML5新增了一些元素，但是也废除了一些元素，虽然这些元素在网页中仍然可以使用，但是避免以后网页显示出现问题，最好还是避免使用它们。...1、可以使用css替代的元素 对于basefont、big、center、font、s、strike、tt、u这些元素，它们的功能都是展现文本效果，HTML5提倡将呈线性功能放在css样式表中统一编辑，...其中s、strike元素可以由del元素替代，tt元素可以由css的font-family属性替代。...2、不再使用frame框架 将frameset、frame和noframes元素废除，由于frame框架可以存在负面影响，在HTML5中不再支持了，只支持iframe框架（很多童鞋可能都不知道frame...框架） 3、只有部分浏览器支持的元素 仅被IE支持的元素：bgsound、marquee； 部分浏览支持的元素：applet、blink； apple元素可由embed元素或者object元素替代 bgsound
HTML5的History模式 我们前面说过改变路径的方式有两种: URL的hash HTML5的history 默认情况下, 路径的改变使用的URL的hash....如果希望使用HTML5的history模式, 非常简单, 进行如下配置即可: image.png router-link补充 在前面的中, 我们只是使用了一个属性: to, 用于指定跳转的路径...但是通常不会修改类的属性, 会直接使用默认的router-link-active即可. image.png 修改linkActiveClass 该class具体的名称也可以通过router实例的属性进行修改...一.在点击导航栏的时候，让被点击的那一个有背景色，其他的没有背景色？...注意如果没有设置router-link的标签类型，会是标签,标签是没有宽度和高度的。
En/DOM/Worker http://www.whatwg.org/specs/web-workers/current-work/ 中文：WEB Workers提升WEB前端脚本JavaScript的处理性能...这里以一个计算加法和乘法为例： 1、创建一个worker 2、worker使用postMessage方法，发送请求，在处理时再通过postMessage返回给消息给创建者，它的onmessage方法会捕获进行处理...3、如果需要kill worker直接使用terminate方法 最终运行的界面 ： ?...getElem("killButton").disabled = true; 63: } 64: 65: getElem("title").innerHTML = "您当前使用的浏览器...68: getElem("output").value = ""; 69: } 70: })(); worker.js的代码
，包括最新的移动手机。...第二个参数是用获取地理位置信息失败的处理方法，传入错误对象，包含code、message两个属性 第三个参数都是geolocation选项，所有的geolocation选项都是可选的，它包含的属性如下...，默认值为0，在放弃并触发处理程序之前，可以等待的时间----用户选择期间是不计时的) maximumAge(单位为毫秒，默认值为0。...DOCTYPE html> HTML5 Geolocation body {background-color...1、accuracy 准确角 2、altitude 海拔高度 3、altitudeAcuracy 海拔高度的精确度 4、heading 行进方向 5、speed 地面的速度 根据获得的纬度与经度，很容易将用户的位置在
这些数据都要手动录入到总部的信息化系统里去，纯英文界面，繁琐的操作流程，再加上老旧的系统设计导致录入的效率极其低下，以资深员工的速度估计，平均每录入一条数据需要花费20分钟，这意味着，每年新增的业务数据需要...大家可以试着想象一下，一整排狭小昏暗的格子间，其中的每位工作人员桌上、抽屉里、脚边都堆放着大量需要录入的资料，几乎要把人深埋在文件山之中，这样的情形要持续十个月，甚至更久——尤其是当新的系统非但没有减轻...很显然，这两种方法都是行不通的。 时下流行的“CEO教练”给了我们新的启发。...CEO绝对比教练更熟悉自己的企业，因此教练的价值不在于告诉CEO怎么做，而是帮助CEO找到合适的解决方案，这与我们的需要不谋而合。...这个手册不是万金油，不能直接给出答案，更不会是说明书，把所有问题都用一个套路来解决，我们更希望它可以成为一个问题集，在NGO成员根据组织现状回答这些问题之后，可以理清思路，由自己的回答挖掘到实际问题所在
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
