对于数字和字符串的 data-attribute 类型转换，使用 −[...document.querySelectorAll("a")].forEach(a => console.log("type: %s, value: %o", typeof a.dataset.value, a.dataset.value) );以上代码适用于以下 data-attributes −6.0 6.5

使用 JavaScript FileReader 允许用户选择图像。让我们来看一个例子 − 以下是 JS 代码 −function readURL(input) { if (input.files && input.files[0]) { var r = new FileReader(); r.onload = function (ev) { $('#myid).attr('src', ev.target.result); } reader.readAsDataURL(input.files[0]); } }

为了更流畅地渲染细字体，使用 −text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important;对于 Google Chrome，使用 −-webkit-font-smoothing:antialiased !important;您可以像这样增强性能 −text-rendering: auto text-rendering: optimizeSpeed text-rendering: optimizeLegibility text-rendering: geometricPrecision text-rendering: inherit

对于视口使用，使用 drawImage() 方法。ctx.clearRect(0,0,game.width,game.height); // 全背景图像 ctx.drawImage(background,cropLeft,cropTop,cropWidth,cropHeight, 0,0,viewWidth,viewHeight);对于游戏 −var myGame = document.getElementById("game"); var myCtx= myGame.getContext("2d"); myCtx.clearRect(0,0,game.width,game.height); // 使用 drawImage() 方法 myCtx.drawImage(background,left,top,350,250,0,0,250,150); myCtx.beginPath(); myCtx.arc(130,80,12,0,Math.PI*2,false); myCtx.closePath(); myCtx.fill(); myCtx.stroke();

您需要跟踪哪些元素触发了 dragenter 和 dragleave。监听单个元素上的 dragenter 和 dragleave 将不仅捕获该元素上的事件，还捕获子元素上的事件。$.fn.draghover = function(options) { return this.each(function() { var collection = $(), self = $(this); self.on('dragenter', function(ev) { if (collection.length === 0) { self.trigger('draghoverstart'); } collection = collection.add(ev.target); }); self.on('dragleave drop', function(ev) { collection = collection.not(ev.target); if (collection.length === 0) { self.trigger('draghoverend'); } }); }); };监听事件 −$(window).draghover().on({ 'draghoverstart': function() { alert('拖入窗口'); }, 'draghoverend': function() { alert('拖出窗口'); } });

重新加载当前页面而不丢失表单数据的最简单方法是使用 WebStorage，其中包含持久性存储 (localStorage) 或基于会话的存储 (sessionStorage)，它会保留在内存中，直到您的网络浏览器关闭。页面即将重新加载时尝试此操作，window.onbeforeunload = function() { localStorage.setItem(name, $('#inputName').val()); localStorage.setItem(phone, $('#inputPhone').val()); localStorage.setItem(subject, $('#inputAddress').val()); }现在像这样检查它 −window.onload = function() { var name = localStorage.getItem(name); var phone = localStorage.getItem(phone); if (name !== null) $('#inputName').val(name); if (phone !== null) $('#inputPhone').val(phone); // ... }

使用 input type=”datetime”。datetime 输入类型在 HTML 中使用 。使用此方法，允许用户选择日期和时间。每当单击输入字段时，都会显示日期时间选择器弹出窗口。 HTML 输入 datetime 详情： 学生姓名 考试日期和时间

IBM Worklight 是一个完整的开发平台。许多关键功能可以在 Worklight 中完成，而您无法使用 PhoneGap 库来完成。PhoneGap 是 Adobe 系统的软件开发框架，用于开发移动应用程序。要使用 PhoneGap 开发应用程序，开发人员不需要掌握移动编程语言，只需要掌握 Web 开发语言，如 HTML、CSS 和 JScript。PhoneGap 为所有流行的移动操作系统平台（如 iOS、Android、BlackBerry 和 Windows Mobile OS 等）生成应用程序。PhoneGap 库和 IBM Worklight 都提供 HTM5 和 CSS 支持。IBM Worklight ... 阅读更多

对于 HTML5 验证，您需要在 Visual Studio 中安装 IntelliSense 和验证支持。Visual Studio 2012 支持 HTML5。VS 2010 具有 IntelliSense 支持，但 VS 2012 添加了相应的代码片段，使其编写标记更快更容易。请按照以下步骤操作 −启动 Visual Studio 2012 转到 工具 > 选项 菜单 当显示选项配置屏幕时，转到 文本编辑器 > HTML > 验证。

为了优化，更改框架的 zindex。这会将图像叠加在一起以解决闪烁问题，因为在重绘时最后一帧仍然可见。不断增加最后一帧的 zindex 值。注意 −您需要再次重置 zindex，这可能会对减少闪烁产生惊人的作用。