主 js 文件看不到在另一个 js 文件中声明的元素值

Question

我在安装一个库时遇到了问题，但我很确定答案更笼统。

我制作了一个 js 文件，它使用以下代码计算“data-x”和“data-y”的值：

$(document).ready(function () {
    var x2 = -1920;
    var y2 = 0;

    var resX = $(window).width();
    var resY = $(window).height();
    var disX = (resX)/1920;
    var disY = (resY)/1080;

    $("#div2").attr('data-x',disX*x2);
    $("#div2").attr('data-y',disY*y2);
});

当我在页面加载后检查 Chrome 控制台时，所有值都正确显示并在其正确的 div 中，但是第一个 js 文件 (impress.js) 看不到这些值，除非它们被硬编码到 HTML文件。

我尝试切换每个文件的加载顺序，但无济于事。这是我的 html 的样子：

http://jsfiddle.net/gVdkL

我可以做些什么来让 impress.js（我下载的 js 库）查看我在 myjs.js 文件中计算的值？是加载方式的问题，还是 html 文档底部的 impress.init() 问题？

任何帮助将不胜感激！谢谢！

Answer 1

看看你的小提琴和你附加的代码，我想问题是你的代码将在 DOM 就绪事件上运行，impress().init() 将在解析时运行（很可能在 DOM 完全完成之前准备好了）。

你可以在你的代码后面加上这一行：

$(document).ready(function () {
    var x2 = -1920;
    var y2 = 0;

    var resX = $(window).width();
    var resY = $(window).height();
    var disX = (resX)/1920;
    var disY = (resY)/1080;

    $("#div2").attr('data-x',disX*x2);
    $("#div2").attr('data-y',disY*y2);


    impress().init(); // <-- init it here after the values are being set
});