Pure JS 是否可以“条件渲染”？

【问题标题】：Is "Conditional Rendering" possible with Pure JS?Pure JS 是否可以“条件渲染”？
【发布时间】：2012-01-20 17:04:54
【问题描述】：

我使用 Pure JS 指令进行渲染：

http://beebole.com/pure/documentation/rendering-with-directives/

如果模板中的某个节点缺失，Pure JS 的默认行为是因为以下原因而崩溃：

在模板中找不到节点“XXX”

这个默认行为是完全可以理解的，因为它确保模板中没有不一致。但是，在相同的情况下，人们希望跳过失败的分配并继续执行其余的分配（可能记录错误），以避免由于单个错误/拼写错误而导致整个渲染失败。

有什么方法可以通过 Pure JS 获得这种行为？我可以告诉 Pure JS 仅在“如果它存在”的情况下渲染一个元素吗？

【问题讨论】：

标签： javascript pure-js

【解决方案1】：

很遗憾，Pure JS 的当前稳定版本（修订：2.79）不允许渲染元素“如果存在”？

以下纯代码 sn-p 显示了错误是如何引发的：

if(selector === '.' || ( !selector && attr ) ){
    target[0] = dom;
}else{
    target = plugins.find(dom, selector);
}
if(!target || target.length === 0){
    return error('The node "' + sel + '" was not found in the template:\n' + outerHTML(dom).replace(/\t/g,'  '));
}

如您所见，如果没有找到target（通过 jQuery、dojo 等库之一），则会引发上述错误。

我在这种情况下使用的解决方法如下：

我将模板与所有可能的元素一起使用，这样 Pure 不会抛出错误
使用 CSS 类隐藏某些元素（例如显示错误消息等）
我使用 Pure 和 JavaScript 函数更改 CSS 类，并使用指令根据输入数据隐藏/显示元素。

【讨论】：