根据链接ID更改div的值

时间:2014-04-12 00:45:17

标签: javascript jquery html json

我几天来一直在研究这个问题,但在任何地方找不到合理的答案。

我有150个链接,只要点击链接就会出现一个div。 div具有以下值:

    <div id="container">
                <div class="profile pic"><img src=xx.jpg</div>
                <div class="bio">bio</div>
                <div class="profilename"><h1>name</h1></div>
                <div class="works">
                    <div class="work firstwork"></div>
                    <div class="work secondwork"></div>
                    <div class="work thirdwork"></div>
                </div>
                <div class="socialicons">
                    <a href="xx.com">icon</a>
                    <a href="xy.com">icon</a>
                    <a href="yy.com">icon</a>

                </div>
            </div>

因此,您可以看到它本质上是一个用户个人资料。我需要做的是基于第一个链接ID,它将是:

ID = “名姓”

更改容器div的每个子div的内容。我有内容,但我无法弄清楚我应该怎么做才能在点击链接时拉出父子div中的内容。

每个配置文件有10个变量,因此10x15 = 1500。

任何想法?!

谢谢!

1 个答案:

答案 0 :(得分:1)

您没有根据链接ID更改内容,您已经根据链接ID检索了数据,现在您想将这些数据放入各种div中。您可以先选择容器一次,然后将其用作其他jQuery选择器中的范围。

var mydata = doSomthingToGetTheJson(someLinkId);
var container = $('#container);
$('.bio', container).text(mydata.bio);
$('.profilename > h1', container).text(mydata.name);

等等。

确定选择器的范围会使它们更快,因为您正在遍历DOM树的一个小得多的部分,并且有助于确保您不会意外地从页面的其他部分选择具有相同类的节点。

当然,你可以做更好的事情,只设置所选内容的.text()内容。

我还会将其中一些类更改为ID,例如,如果页面中只有一个配置文件名称,则 <div id="profilename">如果您更喜欢样式表<div id="profilename" class="profilename">

,也可以保留课程