js文件包含在内.template_file_name 是HTML文件名.
var templates = {
template_file_name : '...template HTML string...',
template_file_name2 : '...template HTML string...',
template_file_name3 : '...template HTML string...'
}
Run Code Online (Sandbox Code Playgroud)
我真的不知道如何处理这个,以及如何从所有文件创建这样的文本..我可以将每个单独的文件转换为字符串,但我怎么能把它放在一个对象中?
对于那些希望您的模板作为ES6模块的人,我创建了gulp-file-contents-to-modules
export var file_name = "This is bar.";
export var file_name2 = "This is foo.\r\n";
export var my-folder__file_name = "This is baz.\r\n";
Run Code Online (Sandbox Code Playgroud)
添加节点,同时从DOM中删除旧节点,不会丢弃内存中的旧节点.(至少不是所有人,没有明显的理由).
(你已经知道了,但无论如何..)
右键单击输出区域并使用Chrome 开发人员工具进行检查.单击时间轴选项卡,然后单击左上角的圆圈(点)开始录制.
现在点击body元素,它将每隔300ms
开始添加和删除项目
(删除的节点应该被垃圾收集).
停止录制,将数据采样区域扩展到最大,您将在屏幕的下半部分看到绿色的节点.预期的图形将上下移动(其中下降意味着GC已正确丢弃节点).
这2个测试页面非常原始.当然,在现实生活中,开发人员使用生成大量文本的模板,这些模板应转换为DOM并注入页面,因此内存中的实时DOM节点数应保持较低,并且必须丢弃已删除的节点.
与jQuery - http://jsbin.com/lamigucuqogi/2/edit - 大约40秒后,GC变得疯狂并停止收集被删除的节点,这会导致通货膨胀.

朴素的方式 - http://jsbin.com/riref/2/edit - 似乎节点没有以令人满意的速度被移除,并且数量不断增长和增长...

为什么会发生这种情况,如何正确地删除NODES以便不会发生通货膨胀?
javascript garbage-collection memory-leaks google-chrome-devtools
$.when 为同时查询的所有多个ajax调用返回Deferred对象.
如果一切都成功.done()执行,并且任何一个url .fail()执行失败.
如何处理部分成功状态?(即)如果传递5个url $.when,如果3个成功,我们需要处理成功状态,并且2失败,我们需要处理失败状态.
$.when($.getJSON(headerUrl), $.getJSON(tasksUrl), $.getJSON(testingTrackerUrl), $.getJSON(highlightsUrl)))
.then(function(headerData, tasksData,testingTrackerData,highlightsData) {
printData(headerData, tasksData,testingTrackerData,highlightsData);
})
.fail(function(data, textStatus, jqXHR) {
console.error('Got error in '+jqXHR);
});
Run Code Online (Sandbox Code Playgroud) 为了提供上下文,我的团队正在浏览器中构建一个富文本编辑器,它需要在会话之间将状态保存到服务器。编辑器的状态显然可以从包含 keydown 事件的文档更新中更改,但我们还应该考虑由撤消/重做事件触发的编辑器阶段的更新。
不幸的是,浏览器没有本机撤消/重做事件(参考)。一项提议的黑客似乎是除了禁用上下文菜单之外,还停止传播映射到撤消键盘快捷键的按键事件。然而,这仍然为用户提供了直接导航到Edit -> Undo应用程序菜单栏的能力,这将直接触发document.execCommand('undo')而不触发事件。因此我们不知道要向服务器发送更新。
这是关于此问题的W3C线程。截至撰写本文时,解决方案似乎仍在制定中......
当另一个浏览器文本编辑器Quill遇到这个问题时,他们的团队似乎建议:“禁用本机撤消/堆栈”,这正是 Facebook 的Draft.js实际所做的。鉴于这似乎是我们正在处理的问题,有谁知道如何禁用/替换浏览器的本机撤消/重做堆栈?显然,这是一个积极的解决方案,但是,在撰写本文时,这似乎是唯一的选择。
与此同时,这个问题的答案可能隐藏在草案代码的某个地方。如果没有人击败我的团队,我会报告选秀的情况。认为至少值得记录这个问题。
我正在使用浏览器的本机提取API来处理网络请求.此外,我正在使用whatwg-fetch polyfill用于不支持的浏览器.
但是,如果请求失败,我需要重试.现在我找到了这个npm包whatwg-fetch-retry,但他们没有解释如何在他们的文档中使用它.有人可以帮我这个或建议我另类吗?
我无法将该行添加为一行,<tbody>因为它将与其余数据一起进行过滤和排序。我希望它成为表数据的外部部分。
将输入放在已经存在的<th>单元格中远不是一个令人满意的解决方案,因为我需要对 CSS 进行大量修改才能使其工作,并在此过程中丢失一些 LESS 变量。
thead > th为了仅将背景保留在表单行上,我需要将其与第一个(也是唯一的)thead<tr>元素分离到它自己的“自定义”行。
有谁知道如何用 Antd 实现这个设计<Table>?
为什么animation属性不适::selection用于CSS中的选择器?
@keyframes frames{
50%{ color:red }
}
@-webkit-keyframes frames{
50%{ color:red }
}
::selection { background:#EEE; animation:0.4s frames infinite; }
::-moz-selection { background:#EEE; animation:0.4s frames infinite; }
::-webkit-selection{ background:#EEE; -webkit-animation:0.4s frames infinite; }Run Code Online (Sandbox Code Playgroud) 如何才能缓存最顶层的范围,以便以后在原型中更深入地使用,如下所示:
var Game = function(id){
this.id = id;
};
Game.prototype = {
board : {
init: function(){
// obviously "this" isn't the instance itself, but will be "board"
console.log(this.id);
}
}
}
var game = new Game('123');
game.board.init(); // should output "123"
Run Code Online (Sandbox Code Playgroud)
那么现在我考虑一下,我可以使用apply/ call并传递上下文...
game.board.init.apply(game);
Run Code Online (Sandbox Code Playgroud) 我刚刚写了我的第一个书签。它是简单的 js 代码,它获取当前页面的 URL 并执行 POST 请求以将其提交到另一个页面。
问题是我需要在不允许 HTML 的博客平台 (quora.com) 上共享此内容。因此,我需要在另一个网站上发布指向我的书签的链接,并提供指向该书签的链接。我希望能够提供一个链接,人们可以将其拖动到书签栏。
这是书签代码。
javascript:(function() {
var msg = window.jQuery.ajax({url:'https://www.quora.com/api/logged_in_user',async:false,type:'GET'});
var username = undefined;
if (msg) {
username = window.jQuery.parseJSON(msg.responseText.replace('while(1);',''));
window.jQuery.post('https://my-website',
{'answer_1':window.location.href,'submitter':username.name});
alert (username.name + ' nominates ' + window.location.href);
}})();
Run Code Online (Sandbox Code Playgroud) 在此示例中,我使用名为ADD_TODO的操作
import { createStore, combineReducers } from 'redux';
function todos(state, action) {
state = state || [];
switch (action.type) {
case 'ADD_TODO':
return state.concat([ action.text ]);
default:
return state;
}
}
function counter(state, action){
state = state || 0;
switch (action.type){
case 'INCREMENT':
return state+1;
case 'DECREMENT':
return state-1;
case 'ADD_TODO':
return state+100;
default:
return state;
}
}
var app = combineReducers({
todos: todos,
counter: counter
});
var store = createStore(app);
store.dispatch({ type: 'ADD_TODO': text: 'buy eggs' }); …Run Code Online (Sandbox Code Playgroud) javascript ×6
antd ×1
bookmarklet ×1
css ×1
deferred ×1
dom ×1
dom-events ×1
events ×1
fetch-api ×1
gulp ×1
jquery ×1
memory-leaks ×1
polyfills ×1
prototype ×1
quora ×1
reactjs ×1
redux ×1
undo ×1