用于从MVC3中的Javascript引用HTML元素的结构

Question

我们有一个ASP.NET MVC3项目。我们使用ajax调用填充我们网站的几个部分。假设我们div中有cshtml，我们希望在其中放置一些搜索结果。

<div id="SearchResult" />

我们已经为我们想要在Javascript文件中引用的所有元素创建了一个包含常量的列表

var selectors = {
    SearchResult: '#SearchResult',
    ...
};

当我们想要访问div时，我们会在Javascripts中使用selectors.SearchResult。

到目前为止，这么好。但是来自c＃世界，我们有强大的绑定，编译时间警告等，我们认为这里的耦合有点松散。如果我们想要重构我们的div ID，我们必须非常小心地找到所有引用并更新它们。

是否有保持javascript和HTML标识符同步的良好做法？用于将所有div id提取到javascript文件中的任何模板/脚本？

Answer 1

向视图添加脚本

<script type="text/javascript">
    window.viewConfig = { searchResult: '#SearchResult' };
</script>

让您的JS文件读取此window.viewConfig.searchResult。

---

您还可以进一步将此ID存储在变量中并使用它。

@{
    var myId = "SearchResult";
}

然后使用@myId，这样div就是

<div id="@myId"></div>

，脚本将是

<script type="text/javascript">
    window.viewConfig = { searchResult: '#@myid' };
</script>