Javascript 为什么不是'；我的css样式没有改变吗？

我正在尝试使用javascript更改文本的颜色，但是像这样简单的东西不起作用，我不明白为什么

var y=document.getElementById（'ya'）；
y、 style.color=“红色”；

你好

试试这个，它正在工作。这是因为脚本现在在DOM元素呈现之后运行

你好

var y=document.getElementById（'ya'）；
y、 style.color=“红色”；

因为javascript是在p标记之前加载的。如果检查控制台，您将看到一个错误“TypeError:无法读取null的属性'style'

你好

var y=document.getElementById（'ya'）；
y、 style.color=“红色”；

在编写JavaScript时，带有

id='ya'

的元素是未定义的。将JavaScript放在头脑中，使用

onload=function（）{/*code here*/}

或

addEventListener（'load'，function（）{/*code here*/}）

，它应该每次都能工作（如果有多个onload，可能不是第一种方法。但是有一种方法可以解决这个问题，将onload分配给一个var，然后在另一个onload之后执行）。实际上，我会使用外部JavaScript，因此它存储在客户端缓存中，这将提高站点性能。只要确保在更新JavaScript、部署站点时更改文件名，或者在仍在处理缓存时清除缓存即可。

首先，您可以检查文件中包含的jQuery.min.js 你的代码很好

测试一下这个

   <script>
      var y = document.getElementById('ya');
       y.css("color", "red");
   </script>

var y=document.getElementById（'ya'）；
y、 css（“颜色”、“红色”）；

您试图查找的元素

id

不在DOM中，因为您的脚本在DOM元素呈现之前运行

您的DOM位置应该首先出现，然后是操作DOM元素的脚本

此问题有两种解决方案：

1.将脚本移动到DOM下方。

<p style="font-size:100px;" id="ya">
    hi
</p>
<script>
  var y = document.getElementById('ya');
  y.style.color = "red";
</script>

你好

var y=document.getElementById（'ya'）；
y、 style.color=“红色”；

2.使用jQuery document.ready（）

你好

$（文档）.ready（函数（）{
var y=document.getElementById（'ya'）；
y、 style.color=“红色”；
});

查看浏览器开发人员工具控制台是否有错误请将脚本块移到p blockThank@JaromandaX下面。这就是问题所在，现在我明白了原因。在页面其余部分加载之前就调用了该元素，并给出一个错误，称该元素为null。感谢大家！

<p style="font-size:100px;" id="ya">
    hi
</p>
<script>
 $(document).ready(function() {
   var y = document.getElementById('ya');
   y.style.color = "red";
 });
</script>