javascript - Javascript 条件语句

Question

我需要在 Adob​​e Business Catalyst 中编写一些 javascript，根据是否从数据库返回值“图像”或“视频”来显示不同的代码行。

返回值的名称是 {tag_detailpage_image_or_video}，它将返回图像或视频。

显示视频的代码是：

<div class="shift-to-hero">
<p>{tag_left_video_detailpage_embed}</p>
</div>

显示图像的代码是：

<figure class="article-image">{tag_left_detail_image_01}<br />
</figure>

我不确定如何在 javascript 中编写代码。

Answer 1

最简单的是，您正在根据变量中包含的内容查找if/语句：else iftag_detailpage_image_or_video

var wrapper, child;
if (tag_detailpage_image_or_video === 'video') {
    wrapper = document.createElement('div');
    child = document.createElement('p');
    wrapper.className = 'shift-to-hero';
    child.innerHTML = tag_left_video_detailpage_embed;
}
else if (tag_detailpage_image_or_video === 'image') {
    wrapper = document.createElement('figure');
    child = document.createElement('br');
    wrapper.innerHTML = tag_left_detail_image_01;
}
else {
    // neither option was returned
}
wrapper.appendChild(child);
document.body.appendChild(wrapper);

虽然你也可以使用switch() {}：

var wrapper, child;
switch (tag_detailpage_image_or_video) {
    case 'video' :
        wrapper = document.createElement('div');
        child = document.createElement('p');
        wrapper.className = 'shift-to-hero';
        child.innerHTML = tag_left_video_detailpage_embed;
        break;
    case 'image' :
        wrapper = document.createElement('figure');
        child = document.createElement('br');
        wrapper.innerHTML = tag_left_detail_image_01;
        break;
}

参考：

• document.createElement().
• element.innerHTML.
• if...else.
• Node.appendChild().
• switch.