无法在运行时将CSS样式添加到元素中

Cannot add CSS style to an element at runtime

本文关键字：添加 元素 样式 CSS 运行时      更新时间：2023-09-26

我有以下代码来更改元素的样式，一旦我进入页面，警报窗口将显示并显示"myP"消息；无论是谁，样式都不会被添加到元素中。另外，如果你有基于jQuery的解决方案，请告诉我。

<!DOCTYPE html>
<html>
 <body>
    <script type="text/javascript">
         alert("myP");
         document.getElementById("myP").style.fontWeight = "bold";
    </script>
    ...
    <a id="myP" href="www.example.com">Example</a>
    ...
    </body>
</html>

根据基于OP jQuery的解决方案的请求，等待加载DOM将是

$(document).ready(function(){
    alert("myP");
    $("#myP").css("font-weight", "bold")
});

这是因为在执行JS代码时没有加载文档。

将javascript代码包装到窗口。onload函数，如下面的

 window.onload = function(){
     alert("myP");
     document.getElementById("myP").style.fontWeight = "bold";
 }

注意：-养成看控制台的习惯。

您的脚本将在加载元素之前运行。您需要将它包装在一个函数中，并在加载文档时调用它。

您的元素不会被脚本找到，因为当您对其调用getElementById时，它不会被加载，所以在关闭body标记之前移动您的脚本代码，如下所示：

<!DOCTYPE html>
<html>
 <body>      
    ...
    <a id="myP" href="www.example.com">Example</a>
    ...
    <script type="text/javascript">
         alert("myP");
         document.getElementById("myP").style.fontWeight = "bold";
    </script>
    </body>
</html>

演示：jsFiddle

相关文章：