CSS javascript/jquery变量使用教程

Question

我正在尝试建立一个页面，它将在div中显示一个图像，并根据它是什么图像，这将填充在同一页面上的图像和文本内容的混合其他3个独立的div。

我只是不知道从哪里开始，因为我发现的所有变量教程/帮助要么让我感到困惑，要么不能真正适用于这种特定的情况。

看起来有一个大的div (divA)，在页面下面有另一个大的div (divB)，它包含三个独立的div (divX，divY和divZ)。我希望div的X，Y和Z的内容根据div A中的内容而改变。因此，如果A有一个变量'1‘，那么X，Y和Z将保留它们自己不同的预先设计的'1’内容。A'2‘然后X，Y和Z将持有自己的'2’content....etc。

我会继续在网上搜索，但我认为有人可以给我指明正确的方向，或者给我如何完成它的跑道。

Answer 1

下面的代码根据"mainWindow“的值使用模板作为查找来填充div。

<div id="mainWindow">windowA</div>

<div>
    <div id="smallWindowA"></div>
    <div id="smallWindowB"></div>
    <div id="smallWindowC"></div>
</div>


<script type="text/javascript">
var template = {
    "windowA" : [ "contentAA", "contentAB", "contentAC" ]
};

function setContent() {

    var content = document.getElementById("mainWindow").innerHTML;
    document.getElementById("smallWindowA").innerHTML = template[content][0];
    document.getElementById("smallWindowB").innerHTML = template[content][1];
    document.getElementById("smallWindowC").innerHTML = template[content][2];

}

setContent();
</script>