Javascript 简单的Body onload函数不触发my函数_Javascript_Css

Javascript 简单的Body onload函数不触发my函数

javascript css

Javascript 简单的Body onload函数不触发my函数,javascript,css,Javascript,Css,我用body onload函数触发这个javascript函数，但我无法让它工作。我做错了什么？以下是我的密码和代码： HTML: 也试过 function loading(){ document.getElementById('container').cssText = "background-image: none"; } CSS: 尝试：尝试：您混淆了本机javascript和jQuery，本机DOM元素上没有css方法： function loading(){

我用body onload函数触发这个javascript函数，但我无法让它工作。我做错了什么？以下是我的密码和代码：

HTML:

也试过

function loading(){   
  document.getElementById('container').cssText = "background-image: none";
}

CSS:

尝试：

您混淆了本机javascript和jQuery，本机DOM元素上没有

css

方法：

function loading(){   
  document.getElementById('container').style.backgroundImage = "none";
}

您混淆了本机javascript和jQuery，本机DOM元素上没有

css

方法：

function loading(){   
  document.getElementById('container').style.backgroundImage = "none";
}

确保您的js已加载到页面的节中

或者，您只能添加

$(function() {
$('#container').css("background-image", "none");
}

在您的js中，从主体中移除onload

我假设您使用的是jquery，否则上面的解决方案就是正确的方法

确保您的js已加载到页面的部分

或者，您只能添加

$(function() {
$('#container').css("background-image", "none");
}

在您的js中，从主体中移除onload

我假设您使用的是jquery，否则上述解决方案就是正确的方法

getElementById

返回一个没有方法的html元素

.css（）

。它的jQuery有这个方法，你的函数也在onload中，所以它被包装在一个函数中，你希望它没有包装头

getElementById

返回一个没有方法的html元素

.css（）

。它的jQuery有这个方法，你的函数也在onload中，所以它被包装在一个函数中，你希望它没有包装头

问题是JSFIDLE被设置为运行您定义的javascript

onLoad

，因此我怀疑它在定义

load（）

方法之前遇到了您的

onLoad=

属性。如果打开控制台，您会看到一个错误“UncaughtReferenceError:Loadingwithnotdefined”（或类似的错误）

您可以将其更改为“无包裹（头部）”，它应该可以正常工作。尽管如前所述，您需要将

css

方法更改为实际有效的方法

我想说一个更简单的解决方案是只使用jquery。使用元素的onload处理程序不再被认为是好的实践（我认为它们现在实际上已经被弃用了？）。最好的解决方案是“不引人注目的javascript”，其中执行的任何js都不需要额外的javascript或html代码中的方法调用。我修改了小提琴，举个例子：

问题是JSFIDLE被设置为运行您定义的javascript

onLoad

，因此我怀疑它在定义

load（）

方法之前遇到了您的

onLoad=

属性。如果打开控制台，您会看到一个错误“UncaughtReferenceError:Loadingwithnotdefined”（或类似的错误）

您可以将其更改为“无包裹（头部）”，它应该可以正常工作。尽管如前所述，您需要将

css

方法更改为实际有效的方法

我还没有看到一个答案，那就是脚本标签必须在body标签内。这是因为脚本标记必须在主体加载之前加载，否则会出现一个错误，表明加载函数未定义

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="YourCSS.css" />
</head>
<body onload="loading()">
    <div id="container">
    </div>
    <script type="text/javascript">
        function loading(){   
            $("#container").attr("style", "background-image: none;");
        };
    </script>
</body>
</html>


函数加载（）{
$（“#容器”）.attr（“样式”，“背景图像：无；”）；
};

我还没有看到一个答案，那就是脚本标签必须在body标签内。这是因为脚本标记必须在主体加载之前加载，否则会出现一个错误，表明加载函数未定义

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="YourCSS.css" />
</head>
<body onload="loading()">
    <div id="container">
    </div>
    <script type="text/javascript">
        function loading(){   
            $("#container").attr("style", "background-image: none;");
        };
    </script>
</body>
</html>


函数加载（）{
$（“#容器”）.attr（“样式”，“背景图像：无；”）；
};

它可以工作，但不起作用，因为onload没有被触发。在你自己的页面中尝试它，而不是在小提琴上。是的，我没有激活不换行符头。谢谢你的回答，底线实际上是JavaScript的语法，而不是代码的位置（这是次要的）。谢谢你，感谢…不换行符（头）一直是我的问题，因为我在发布这个问题之前尝试了.style.backgroundImage，但当时也不起作用，因为onload没有被触发，所以它起作用但不起作用。在你自己的页面中尝试它，而不是在小提琴上。是的，我没有激活不换行符头。谢谢你的回答，底线实际上是JavaScript的语法，而不是代码的位置（这是次要的）。谢谢你，感谢…不换行符（头）一直是我的问题，因为我在发布这个问题之前试过了。style.backgroundImage，但当时也不起作用。谢谢你，感谢…没有包装（head）一直是我的问题，因为我试过。style.backgroundImage…谢谢你，感谢…没有包装（head）一直是我的问题，因为我试过。style.backgroundImage…谢谢你，感谢…没有包裹（头）一直是我的问题，因为我尝试了。风格。背景图片…谢谢，感谢…没有包裹（头）一直是我的问题，因为我尝试了。风格。背景图片…是的，谢谢，但指的是我的JSFIDLE，在我的网站上，我确实在body元素中有它。实际上，真正的问题是在呈现

标记之前必须定义

load（）

函数。无论您是将其粘贴在外部js文件中并从中包含它，还是仅在body标记中定义它（但我认为这会创建一个混乱的文档，将来可能很难维护……您的js应该都位于一个容易定位的位置）@nzifna

$(function() {
$('#container').css("background-image", "none");
}

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="YourCSS.css" />
</head>
<body onload="loading()">
    <div id="container">
    </div>
    <script type="text/javascript">
        function loading(){   
            $("#container").attr("style", "background-image: none;");
        };
    </script>
</body>
</html>