javascript - jQuery 不读取 CSS

Question

// Helper func
init = (obj, id) => {
  return obj.style.split(':')[id]
}

train = (i, o) => {
  iProp = init(i, 0);
  iVal = init(i, 1);
  oProp = init(o, 0);
  oVal = init(o, 1);

  alert($(i.dom).css('color'))
}

train({
  dom: 'p',
  style: 'color:rgb(0, 0, 0)'
}, {
  dom: 'p',
  style: 'color:rgb(0, 50, 65)'
})

p {
  color: black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Text</p>

当我运行代码时，它会发出一个空警报，而在 Writer 编辑器中，它会发出一个警报“未定义”。为什么 jQuery 看不到 CSS，但我在 HTML 页面的顶部添加了 CSS。为什么会输出undefined，如何解决？

Answer 1

我不认为 jQuery 或 javascript 有问题，原因如下:

1. 我运行了您的代码，发现在实际呈现 DOM 之前就触发了警报。请看下面的截图:

1. 您的警报会在您的脚本被触发时自动调用，这是在呈现 HTML 之前。所以，我将脚本移到了文档的底部并且它起作用了。请看下面的截图:

简而言之，我建议您在 DOM 实际准备就绪时手动调用警报。

希望对您有所帮助。