Question

我的脚本中有以下行，根据从JSON检索的新闻Feed数据构建字符串：

 var buildstring = "<table><tr><img src=" + obj.value.items[x]["media:content"].url + "> <b>" + obj.value.items[x].title + "</b><br /><td>" + obj.value.items[x].description.content + "</td></tr></table><br />";

一般情况下它工作正常 - 除了一件事。偶尔被解析的订阅源没有与特定标题和描述相关联的图像文件，在这种情况下，整个脚本失败。

有没有办法让脚本跳过Feed中任何缺少的项目，并从那里的项目构建字符串？例如。如果故事没有图像文件，那么字符串只包含标题和描述？在典型的情况下，我正在拍摄5-10个故事 - 如果他们都有3个元素（图像，标题和描述。内容），那一切都很好。如果一个故事缺少图像文件，我什么都没有。

感谢您的任何建议或帮助。

编辑：

更完整的代码：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"> </script><script type="text/javascript">

function pipeCallback(obj) {
document.write("<div id=testdiv><b>LATEST NEWS</b><hr>");
var x;
for (x = 0; x < obj.count ; x++)
{
var imageurl = obj.value.items[x]["media:content"].url ? obj.value.items[x]["media:content"].url : "http://static.jquery.com/org/images/project/jquery-project-sm.png";
var buildstring = "<table><tr><img src=" + imageurl + "> <b>" + obj.value.items[x].title + "</b><br /><td>" + obj.value.items[x].description.content + "</td></tr></table><br />";
document.write(buildstring);
buildstring = null;
}
document.write("</div>");

}
</script>

Answer 1

您可以使用三元表达式来构建字符串：

var textOnly = "<b>" + obj.value.items[x].title + "</b><br /><td>" + obj.value.items[x].description.content + "</td></tr></table><br />";
var buildstring = (typeof obj.value.items[x]["media:content"] == 'undefined') ? 
    "<table><tr><td><img src=" + obj.value.items[x]["media:content"].url + "></td>" + textOnly 
    : "<table<tr><td></td>" + textOnly;

显然这变得非常丑陋，快速，这就是为什么他们发明了客户端模板（JQuery templating，Underscore.js，Mustache.js，Handlebars.js等等，请选择）。

这些允许您将数据与标记分开，因此您可以编写如下内容：

var template = "<table><tr><td><img src='{{ image }}' /></td><td>{{ title }}</td><td>{{ description }}</td></tr></table>";

您可以从数据+模板中获取HTML：

var html = Mustache.render(template, obj.value.items[x]);

Answer 2

最好的选择就是包含占位符，对吧？因此，如果没有图像，则占位符显示...

这将是这样实现的：

var imageurl = obj.value.items[x]["media:content"].url ? obj.value.items[x]["media:content"].url : "http://link.to.default/image.png";
var buildstring = "<table><tr><img src=" + imageurl  + "> <b>" + obj.value.items[x].title + "</b><br /><td>" + obj.value.items[x].description.content + "</td></tr></table><br />";

解析JSON - 缺少预期元素时脚本失败

2 个答案: