jquery .data适用于IE，但不适用于chrome或firefox

Question

我有这样的标记：

<li id="myId" data-foo="Bar">Text</li>

在IE中，我使用data-foo成功获得了$('#myId').data('foo')的价值，但它在Chrome或Firefox中没有返回任何内容。

对于它的价值信息：
该页面由asp.net mvc从模板生成。
尝试访问data-foo的函数是从包含上面<li>元素的页面启动的弹出窗口调用的。
我也试过$('#myId').attr('data-foo')但没有运气

感谢您提供的任何帮助

更新 该问题与在启动弹出窗口后尝试访问该属性密切相关。

更新2 我无法隔离问题以便在jsfiddle中复制它。我在上面说过，它与弹出窗口启动后访问属性完全相关，但经过进一步调查，情况并非如此。有几个框架正在使用，我没有时间来搜索所有这些bug，所以我找到了一个解决方法。我只是想感谢大家的努力，并为了占用你的时间而放弃所有人。

Answer 1

这适用于Chrome和Firefox。

Here is my test ...

<ul>
    <li id="myId" data-foo="Bar">Text</li>
</ul>
<script>
    alert($('#myId').data('foo'));
</script>

这可能失败的最可能原因是您在加载元素之前运行jQuery，因此请确保您的脚本位于文档的末尾，或使用$(document).ready(语法确保DOM是随时可以查询。

我使用jQuery 1.9来测试它。

Answer 2

我注意到你在列表项上使用它。您能绝对肯定地确认您的身份证是唯一的吗？这可能会导致浏览器出现一些不同的意外结果。

编辑： HTML中的语法错误是造成这类问题的主要原因。我建议您逐段删除部分HTML代码，直到它按预期工作，然后您就可以确定问题所在。