Javascript TypeError:document.getElementById(…)为空
我正在尝试使用 我的html有这个脚本标记Javascript TypeError:document.getElementById(…)为空,javascript,template-engine,Javascript,Template Engine,我正在尝试使用 我的html有这个脚本标记 <script type="text/html" id="item_tmpl"> <div> <div class="grid_1 alpha right"> </div> <div class="grid_6 omega contents"> <p><b><a href="/<%=AdTitle%>"><%=
<script type="text/html" id="item_tmpl">
<div>
<div class="grid_1 alpha right">
</div>
<div class="grid_6 omega contents">
<p><b><a href="/<%=AdTitle%>"><%=AdTitle%></a>:</b> <%=AdTitle%></p>
</div>
</div>
</script>
<script src="${URLUtils.staticURL('/js/shoptheAd.js')}"type="text/javascript"></script>
The Script contains the following code
(function(app){
if (app) {
var cache = {};
this.tmpl = function tmpl(str, data){
// Figure out if we're getting a template, or if we need to
// load the template - and be sure to cache the result.
var fn = !/\W/.test(str) ?
cache[str] = cache[str] ||
tmpl(document.getElementById(str).innerHTML) :
// Generate a reusable function that will serve as a template
// generator (and which will be cached).
new Function("obj",
"var p=[],print=function(){p.push.apply(p,arguments);};" +
// Introduce the data as local variables using with(){}
"with(obj){p.push('" +
// Convert the template into pure JavaScript
str
.replace(/[\r\t\n]/g, " ")
.split("<%").join("\t")
.replace(/((^|%>)[^\t]*)'/g, "$1\r")
.replace(/\t=(.*?)%>/g, "',$1,'")
.split("\t").join("');")
.split("%>").join("p.push('")
.split("\r").join("\\'")
+ "');}return p.join('');");
// Provide some basic currying to the user
return data ? fn( data ) : fn;
};
var sitecoresuggestions = {
"suggestions": [
{
"AdTitle": "CheckAd",
"AdDescription": "",
"AdImageUrl": "http://demo-kiehls.loreal.photoninfotech.com/~/media/Advertisement Images/emma-watson-3.ashx",
"Count": 2,
"Hit": 0
},
{
"AdTitle": "CheckAd",
"AdDescription": "",
"AdImageUrl": "http://demo-kiehls.loreal.photoninfotech.com/~/media/Advertisement Images/kate2.ashx",
"Count": 2,
"Hit": 0
}
]
} ;
var show_user = tmpl("item_tmpl"), html = "";
for ( var i = 0; i < sitecoresuggestions.suggestions.length; i++ ) {
html += show_user( sitecoresuggestions.suggestions[i] );
}
console.log(html);
} else {
// namespace has not been defined yet
alert("app namespace is not loaded yet!");
}
})(app);
When the show_user = tmpl("item_tmpl") is executed
i get the error TypeError: document.getElementById(...) is null
:
该脚本包含以下代码
(功能(应用程序){
如果(应用程序){
var cache={};
this.tmpl=函数tmpl(str,data){
//弄清楚我们是否得到了一个模板,或者我们是否需要
//加载模板-并确保缓存结果。
变量fn=!/\W/.test(str)?
缓存[str]=缓存[str]||
tmpl(document.getElementById(str.innerHTML):
//生成将用作模板的可重用函数
//生成器(将被缓存)。
新功能(“obj”,
var p=[],print=function(){p.push.apply(p,参数);}+
//使用with(){}将数据作为局部变量引入
“与(obj){p.push('”+
//将模板转换为纯JavaScript
str
.replace(/[\r\t\n]/g,“”)
.split(“每个帖子:
快速提示:在页面中嵌入内容类型未知的脚本(这里就是这种情况->浏览器不知道如何执行文本/html脚本)被浏览器和搜索引擎和屏幕阅读器忽略。它是将模板潜入>页面的完美隐形设备。我喜欢在快速和肮脏的情况下使用此技术,在这些情况下,我只需要在页面上放置一两个>模板,并且想要一些轻快的东西
因此,页面实际上并没有呈现HTML,我假设您在页面中只会引用它,以便您可以提取并应用于其他对象或项目。正如blogger所述,您可以像这样使用它:
var results = document.getElementById("results");
results.innerHTML = tmpl("item_tmpl", dataObject);
John Resig在博客上对此进行了讨论,这是一个相当受欢迎的引擎,在互联网上的每个视图中都有。您所显示的代码实际上从未在任何地方插入内容。var show_user=tmpl(“item_tmpl”),html=“”;for(var i=0;ivar results = document.getElementById("results");
results.innerHTML = tmpl("item_tmpl", dataObject);