我将如何调整此浏览器代码以在我的Node.js应用程序上运行?
问题描述:
var templateSource = document.getElementById('result-template').innerHTML,
template = Handlebars.compile(templateSource),
resultsPlaceholder = document.getElementById('result'),
loginButton = document.getElementById('btn-login');
现在我不明白这段代码到底在做什么。我从here得到了这段代码,并将它放入我的srcServer.js
。我已经包括通过线import document from 'document';
的document
lib中,但我得到以下错误:我将如何调整此浏览器代码以在我的Node.js应用程序上运行?
/Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/buildScripts/srcServer.js:71
var templateSource = _document2.default.getElementById('result-template').innerHTML,
^
TypeError: _document2.default.getElementById is not a function
at /Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/buildScripts/srcServer.js:60:35
at Object.<anonymous> (/Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/buildScripts/srcServer.js:14:1)
at Module._compile (module.js:624:30)
at loader (/Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/node_modules/babel-register/lib/node.js:144:5)
at Object.require.extensions.(anonymous function) [as .js] (/Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/node_modules/babel-register/lib/node.js:154:7)
at Module.load (module.js:545:32)
at tryModuleLoad (module.js:508:12)
at Function.Module._load (module.js:500:3)
at Function.Module.runMain (module.js:665:10)
at /Users/sharanduggirala/Documents/UID/CS235ProjectJS 4/node_modules/babel-cli/lib/_babel-node.js:159:24
下面一行:
var templateSource = document.getElementById('result-template').innerHTML
我已经包括内部package.json
太依赖文件:
"devDependencies": {
"document": "0.4.7",
...
我应该从在线示例中获取更多文件吗?我不确定这里的错误是什么。有在JFiddle
例如有些文件:
我应该将它们纳入我的项目,如果是这样,在src
文件夹?
答
var templateSource = document.getElementById('result-template').innerHTML,
template = Handlebars.compile(templateSource),
resultsPlaceholder = document.getElementById('result'),
loginButton = document.getElementById('btn-login');
这里有一些事情正在进行。一是一些速记变量声明,所以让我们改变它们,让它们更清楚:
var templateSource = document.getElementById('result-template').innerHTML;
var template = Handlebars.compile(templateSource);
var resultsPlaceholder = document.getElementById('result');
var loginButton = document.getElementById('btn-login');
这是我看到的情况,而无需除了它是一个模板引擎把手的任何理解:
// find an element on your page that has id="result-template"
// look for something like <div id="result-template">
// .innerHTML takes the content from that element and preserves the HTML part of it
// there is also .innerText which would strip the HTML out
var templateSource = document.getElementById('result-template').innerHTML;
// run that content from above through a compile function
// this is probably used to help Handlebars understand the HTML
// and so Handlebars can re-render it
var template = Handlebars.compile(templateSource);
// this is simply getting an element called id="result" (ie: <div id="result">)
// once your code has this element, it can execute further logic on it
// try typing it into your console: document.getElementById('result')
// see what is displayed
// this also doesn't appear connected with the first two lines of code
var resultsPlaceholder = document.getElementById('result');
// this is also not connected to the other three lines of code.
// it is also finding an element by ID
// clearly a login button, for some reason
var loginButton = document.getElementById('btn-login');
希望这是有帮助的。
它看起来像你的问题是document
未定义,或它不是文件。
+1
是的,这很好的解决了我的问题! –
@BhojendraNepal我不明白,我自己。 –
该代码是浏览器代码,需要DOM中的内容才能做有用的事情。它从页面中获取一些文本,该文本显然被格式化为句柄模板,然后编译该模板(将其转换为HTML),然后在页面中找到两个其他元素。它实际上并没有对HTML做任何事情。这段代码完全是为了在浏览器中运行而设计的。你为什么试图在node.js中运行它?你想达到什么目的? – jfriend00
@ jfriend00我稍微修改了一下问题,以反映我对问题的一些理解。 –