Javascript 函数在 JSFiddle 中工作，但在我的本地副本上不起作用-6ren

Javascript 函数在 JSFiddle 中工作，但在我的本地副本上不起作用

转载作者：行者123 更新时间：2023-12-02 17:41:37

25

4

我正在尝试用 Javascript 制作一个简单的淡出效果。

当我在文本编辑器 + Google Chrome 中尝试时它不起作用，所以我将其复制到 JSFiddle 中并且它起作用了!

http://jsfiddle.net/yLFFt/

但是，我无法弄清楚 JSFiddle 中哪些是正确的，而在我的原始副本中是不正确的。

我将发布 Notepad++ 中的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<html>
    <head>
        <title>My Site</title>
        <link rel="stylesheet" type="text/css" href="style2.css">
        </style>
        <script>
          (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
          (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
          m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
          })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

          ga('create', 'UA-08000000-1', 'mysite.com');
          ga('send', 'pageview');

        </script>
        <script type="text/javascript" src="js/jquery_1.4.2.js"></script>
        <script type="text/javascript" src="js/flashing_logos.js"></script>
    </head>
    <body>
        <div id="background_logo">
            <img src="http://drivesmartbc.ca/sites/default/files/images/smiley%20face.thumbnail.jpg">
        </div>
        <div id="logo">
            <img src="https://lh4.googleusercontent.com/-b86bjfIcDMk/TXpUmwBK_FI/AAAAAAAAARY/ws-ypr2P39I/s200/9+smiley+face.jpg">
        </div>
        <div id="signup">
            <p id="instruction"> Get on board! </br> Enter your email to receive updates:</p>
            <script type="text/javascript" src="js/form-validation.js"></script>
            <form id="emailForm" action='#' method="post">
                <input name="email"  id="email" type="text" />
                <input type="button" value="Submit" name="submit" id="submit" />
            </form>
            <p id="success" class="success">Thanks - we'll keep in touch!</p>
            <p id="error" class="warning">There was an error</p>
        </div>
    </body>


</html>

我的 Javascript 看起来像这样:

function fade(element) {
    var op = 1;  // initial opacity
    var timer = setInterval(function () {
        if (op <= 0.1){
            clearInterval(timer);
            element.style.display = 'none';
        }
        element.style.opacity = op;
        element.style.filter = 'alpha(opacity=' + op * 100 + ")";
        op -= op * 0.1;
    }, 50);
}
fade(document.getElementById('background_logo'));

最佳答案

您正在调用document.getElementById('background_logo')来自 head 中的脚本并且您不是从稍后调用的函数中执行此操作。

在解析主体之前该元素将不存在。

将脚本移至 <div id="background_logo"> 末尾之后(例如，在 </body> 之前)或将其包装在一个函数中，可以在 DOM 就绪或 Load 上调用它(这是 JSFiddle 默认情况下所做的)。

另请参阅Why does jQuery or a DOM method such as getElementById not find the element? .

关于Javascript 函数在 JSFiddle 中工作，但在我的本地副本上不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22158016/

25

4

0

文章推荐： javascript - 切换 boolean 变量(应用)

文章推荐： PHP is_null : Only boolean true and false, 甚至不是 null？

文章推荐： java - 使用线程和 ProcessBuilder

文章推荐： javascript - 计算特定表上的行数

详解C语言sscanf()函数、vsscanf()函数、vscanf()函数
C语言sscanf()函数：从字符串中读取指定格式的数据头文件： ?
php - 如何解释at()函数； substr()函数;伪代码中的exist()函数
最近，我有一个关于工作预评估的问题，即使查询了每个功能的工作原理，我也不知道如何解决。这是一个伪代码。下面是一个名为foo()的函数，该函数将被传递一个值并返回一个值。如果将以下值传递给foo函数，
VBS教程：函数-CStr 函数
CStr 函数返回表达式，该表达式已被转换为 String 子类型的 Variant。 CStr(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CSng 函数
CSng 函数返回表达式，该表达式已被转换为 Single 子类型的 Variant。 CSng(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-CreateObject 函数
CreateObject 函数创建并返回对 Automation 对象的引用。 CreateObject(servername.typename [, location]) 参数 serv
VBS教程：函数-Cos 函数
Cos 函数返回某个角的余弦值。 Cos(number) number 参数可以是任何将某个角表示为弧度的有效数值表达式。说明 Cos 函数取某个角并返回直角三角形两边的比值。此比值是
VBS教程：函数-CLng 函数
CLng 函数返回表达式，此表达式已被转换为 Long 子类型的 Variant。 CLng(expression) expression 参数是任意有效的表达式。说明通常，您可以使
VBS教程：函数-CInt 函数
CInt 函数返回表达式，此表达式已被转换为 Integer 子类型的 Variant。 CInt(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-Chr 函数
Chr 函数返回与指定的 ANSI 字符代码相对应的字符。 Chr(charcode) charcode 参数是可以标识字符的数字。说明从 0 到 31 的数字表示标准的不可打印的
VBS教程：函数-CDbl 函数
CDbl 函数返回表达式，此表达式已被转换为 Double 子类型的 Variant。 CDbl(expression) expression 参数是任意有效的表达式。说明通常，您可
VBS教程：函数-CDate 函数
CDate 函数返回表达式，此表达式已被转换为 Date 子类型的 Variant。 CDate(date) date 参数是任意有效的日期表达式。说明 IsDate 函数用于判断 d
VBS教程：函数-CCur 函数
CCur 函数返回表达式，此表达式已被转换为 Currency 子类型的 Variant。 CCur(expression) expression 参数是任意有效的表达式。说明通常，
VBS教程：函数-CByte 函数
CByte 函数返回表达式，此表达式已被转换为 Byte 子类型的 Variant。 CByte(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CBool 函数
CBool 函数返回表达式，此表达式已转换为 Boolean 子类型的 Variant。 CBool(expression) expression 是任意有效的表达式。说明如果 ex
VBS教程：函数-Atn 函数
Atn 函数返回数值的反正切值。 Atn(number) number 参数可以是任意有效的数值表达式。说明 Atn 函数计算直角三角形两个边的比值 (number) 并返回对应角的弧
VBS教程：函数-Asc 函数
Asc 函数返回与字符串的第一个字母对应的 ANSI 字符代码。 Asc(string) string 参数是任意有效的字符串表达式。如果 string 参数未包含字符，则将发生运行时错误。
VBS教程：函数-Array 函数
Array 函数返回包含数组的 Variant。 Array(arglist) arglist 参数是赋给包含在 Variant 中的数组元素的值的列表（用逗号分隔）。如果没有指定此参数，则
VBS教程：函数-Abs 函数
Abs 函数返回数字的绝对值。 Abs(number) number 参数可以是任意有效的数值表达式。如果 number 包含 Null，则返回 Null；如果是未初始化变量，则返回 0。
VBS教程：函数-FormatPercent 函数
FormatPercent 函数返回表达式，此表达式已被格式化为尾随有 % 符号的百分比（乘以 100 ）。 FormatPercent(expression[,NumDigitsAfterD
VBS教程：函数-FormatNumber 函数
FormatNumber 函数返回表达式，此表达式已被格式化为数值。 FormatNumber( expression [,NumDigitsAfterDecimal [,Inc

首页

博学

6Ren·AI

商城

Javascript 函数在 JSFiddle 中工作，但在我的本地副本上不起作用