从html代码中删除和事件。 [英] Removing and event from the html code.

问题描述

我正在更新一个使用嵌入在

页面上的倒计时脚本的网站。当页面被提供时，var'被设置为

倒计时在几分钟和几秒内剩余的时间，但是脚本的剩余部分

保持不变。


但是我想将该脚本从页面中取出并将其作为一个可以缓存的

单独文件，从而降低服务成本 - 页面

每天被击中几千次，有时高达5K，所以

任何节省都会成倍增加。


原文是：

----------

var min = 40;

var sec = 40;


功能倒计时（）

{

if（sec == 0&& min> 0）

{sec = 59; min--; }

else

{sec--; }


msg =''< b>下一个Tick：''+ min +''：''+（（秒<10）？''0''：' '''）+ sec +

''< / b>'';


if（document.all）

document.all.tel.innerHTML = msg;

else if（document.getElementById（''tel''））

document.getElementById（''tel'' ）.innerHTML = msg;


if（sec == 0&& min == 0）

{min = 60;秒= 00; }

if（sec> 0 || min> 0）

setTimeout（''countdown（）''，1000）;

}

window.onload =倒计时;

----------

注意：var设置为40用于测试目的。在实际的脚本

中，它们被设置为服务器上剩余的时间。


所以我认为最简单的方法是做这个功能接受

两个vars，然后将参数传递给

html内的函数。


然而我最接近得到的是：

----------

功能倒计时（m，s）

{

sec = s;

min = m;


if（sec == 0&& min> 0）

{sec = 59; min--; }

else

{sec--; }


msg =''< b>下一个Tick：''+ min +''：''+（（秒<10）？''0''：' '''）+ sec +

''< / b>'';


if（document.all）

document.all.tel.innerHTML = msg;

else if（document.getElementById（''tel''））

document.getElementById（''tel'' ）.innerHTML = msg;


if（sec == 0&& min == 0）

{min = 60;秒= 00; }

if（sec> 0 || min> 0）

setTimeout（" countdown（min，sec）"，1000）;

}

window.onload =倒计时（40,40）;

----------

这个代码只能在FF中运行 - 它在IE6中停止工作。只要我将
移出.js文件中的''window.onload''行并进入HTML

代码，它就会停止在FF中运行。我认为代码将是

跟随，包含在< head>中：

----------

< script src =" scripts / countdown.js" type =" text / javascript">

<！ -

window.onload = countdown（40,40）;

// - >

< / script>

----------


什么我需要做些什么才能让这个工作？


谢谢，Graham Reeds。

解决方案

< blockquote>
gr**********@gmail.com ：

我正在更新一个使用
页面上嵌入的倒计时脚本的网站。当页面被提供时，var'被设置为
倒计时在几分钟和几秒内剩余的时间，但是脚本的其余部分保持不变。

但是我想把这个脚本从页面中删除，并将其作为一个可以缓存的单独文件，降低服务成本 - 页面每天被击中几千次，有时甚至高一个5K，所以任何节省都会成倍增加。

原始剧本是：
----------
var min = 40;
var sec = 40;

功能倒计时（）
{
if（sec == 0&& min> 0）
{sec = 59; min--; }
其他
{sec--; }

msg =''< b>下一个Tick：''+ min +''：''+（（秒<10）？''0''：''''） + sec +
''< / b>'';

if（document.all）
document.all.tel.innerHTML = msg;
else if（document.getElementById（''tel''））
document.getElementById（''tel''）。innerHTML = msg;

if（sec == 0&& min == 0）
{min = 60;秒= 00; }


你确定可以达到这个条件吗？除了将你的var

秒和min设置为零。 sec = 0;就够了。

if（sec> 0 || min> 0）
setTimeout（''countdown（）''，1000）;
}
窗口。的onload =倒计时;


您的原始脚本似乎是正确的。但是，您还必须知道您的页面有多大。如果你的页面非常大（有很多

的内容），那么当你的倒计时功能在1秒后被调用时，

就是tel。 id是否可用？

----------
注意：为了测试目的，var设置为40。在实际的脚本中
将它们设置为服务器上剩余的时间。

所以我认为最简单的方法就是让函数接受两个变量，然后将参数传递给
html中的函数。

然而，我能得到的最接近的是：
---------- {
sec = s;
min = m;

if（sec == 0&& min> 0）
{sec = 59; min--; }
其他
{sec--; }

msg =''< b>下一个Tick：''+ min +''：''+（（秒<10）？''0''：''''） + sec +
''< / b>'';

if（document.all）
document.all.tel.innerHTML = msg;
else if（document.getElementById（''tel''））
document.getElementById（''tel''）。innerHTML = msg;

if（sec == 0&& min == 0）
{min = 60;秒= 00; }
if（sec> 0 || min> 0）
setTimeout（" countdown（min，sec）"，1000）;
}
window.onload = countdown （40,40）;


这里的问题也是我上面提到的。另外，你现在更改了

你的window.onload赋值是

倒计时的返回值，而在原始脚本中，它是对
函数。

----------
这段代码只适用于FF - 它在IE6中停止工作。只要我将''window.onload''行移出.js文件并移入HTML
代码，它就会停止在FF中工作。我认为代码将是
跟随，包含在< head>中：
----------
< script src =" scripts / countdown.js" ; type =" text / javascript">
<！ -
window.onload = countdown（40,40）;
// - >
< / script>
----------


移动window.onload = countdown;回到你的外部js文件和

使用原始代码。

我需要做些什么才能使这个工作？

谢谢，格雷厄姆芦苇。

>你确定可以达到这个条件吗？除了将var

sec和min设置为零。 sec = 0;就足够了。


没有秒= 0不够。只要考虑该行的作用将使b / b $ b $无效。如果是秒> 0不够，因为在

结束时，一分钟秒将等于零，倒计时将

停止。

但是，您还必须意识到您的页面有多大。如果你的页面确实很大（有很多内容），那么当你的倒计时功能在
1秒后调用时，就是tel。在那时可以使用id？


这就是使用window.onload事件的原因。一旦页面加载完成，window.onload事件就会被触发。

移动window.onload = countdown;回到你的外部js文件并使用原始代码。

正如我在原帖中所述，该网站将javascript嵌入到
$中b $ b页面并在生成页面时更改了两个值。我想要将javascript从页面中移出一个单独的文件，但是我还需要能够将两个值发送到该函数。 40，

40值就在那里，所以我可以看看我的更改是否打破了

的代码。


G 。

gr ***** *****@gmail.com 写道：

我正在更新一个使用
页面上嵌入的倒计时脚本的网站。当页面被提供时，var'被设置为
倒计时在几分钟和几秒内剩余的时间，但是脚本的其余部分保持不变。

但是我想把这个脚本从页面中删除，并将其作为一个可以缓存的单独文件，降低服务成本 - 页面每天被击中几千次，有时甚至高一个5K，所以
任何节省都会成倍增加。

[...]
if（document.all）
document.all.tel.innerHTML = msg;
else if（document.getElementById（''tel''））
document.getElementById（''tel''）。innerHTML = msg;


该测试更适用于：


if（document.getElementById）{

文件。 getElementById（''tel''）。innerHTML = msg;

}否则if（document.all）{

document.all [''tel'']。innerHTML = msg;

}


因为可能有更多浏览器理解

getElementById而不是document.all。

if（sec == 0&& min == 0）
{min = 60;秒= 00; }
if（sec> 0 || min> 0）
setTimeout（''countdown（）''，1000）;


setTimeout不能保证在指定的时间间隔内运行。


取决于您需要的准确度（整个时间间隔或<每个tick都有
，一个更好的解决方案可能是获取当地时间，添加你的偏移量，然后根据它进行倒计时。每隔约200毫秒以
的速度运行倒计时，这样你就不会错过时钟的''滴答'，或者更多的时间，如果你的话感觉需要 - 但考虑到你可能已经运行的其他脚本以及

用户PC上的总体工作量将会是什么。


}
window.onload =倒计时;


这里没有括号 - window.onload正在传递一个函数的

引用，这是正常的事情。你的新

window.onload是完全不同的（见下文）。

[...]然而，我能得到的最接近的是：
--- -------
功能倒计时（m，s）
{
sec = s;
min = m;


这看起来毫无意义，为什么不只是使用m&其余的

的剧本，或使用：


功能倒计时（分钟，秒）


if（sec == 0&& min> 0）
{sec = 59; min--; }
其他
{sec--; }

msg =''< b>下一个Tick：''+ min +''：''+（（秒<10）？''0''：''''） +秒+


秒数填充前导零，为什么不是分钟呢？

[...]

if（sec == 0&& min == 0）
{min = 60;秒= 00; }


这可以确保您的计时器永不过期（无论您使用00还是0） -

它会在运行时重新设置为60分钟。为什么你认为你需要

00而不是0？


if（sec> 0 || min> 0）


if（sec || min）


会做。


setTimeout（" countdown（min，sec）" ，1000）;


如果你想把这个函数的变量引用传递到下一个：


if（sec || min）{

setTimeout（function（）{

倒计时（分钟，秒）;

}，1000）;

}


}
window.onload =倒计时（40,40）;


在这里你将函数的结果传递给window.onload - 这是立即执行的
，很可能是在页面的其余部分加载之前。


如果你继续使用全局变量，那么使用与上面的

相同的语句。如果你想用参数调用函数，请使用：


window.onload = function（）{countdown（40,40）; }


----------
此代码仅适用于FF - 它在IE6中停止工作。只要我将''window.onload''行移出.js文件并移入HTML
代码，它就会停止在FF中工作。我认为代码将是


你会得到什么错误信息？像''预期对象''或

类似的东西？

跟随，包含在< head>中：
----------
< script src =" scripts / countdown.js" type =" text / javascript">
<！ -


不要在脚本标签内使用HTML注释分隔符，它可以有

不需要的副作用并没有用处。


window.onload = countdown（40,40）;


这会将运行倒计时的* result *分配给window.onload。由于

它没有返回任何东西，所以它不会运行。倒计时立即运行

，我怀疑它有时在.js文件中有效，因为

文件加载速度足够慢，到执行时，'' tel''

元素存在。如果不是，则脚本错误。

// - >
< / script>
----------

我需要做些什么才能使其正常工作？

以下整个脚本可以放在外部文件中。如果你想要在HTML文件中使用全局变量，请将它们放在脚本元素中的HTML

中并使用它们：

< ; script type =" text / javascript">


函数countDown（t，el）

{

var tLeft = t - new Date（）。getTime（）;

var mLeft = Math.floor（tLeft / 60000）;

var sLeft = Math.floor（（tLeft％） 60000）/ 1000）;


mLeft =（mLeft< 10）？ ''0''+ mLeft：mLeft;

sLeft =（sLeft< 10）？ ''0''+ sLeft：sLeft;

el.firstChild.data = mLeft +''：''+ sLeft;


if（tLeft> ; 1000）{

setTimeout（function（）{

countDown（t，el）;

}，200）;

}

}


函数startCountDown（min，sec）

{

if（！document.getElementById ||！document.createTextNode）return;

var stopMSec = new Date（）。getTime（）+（min * 60 + sec）* 1000 - 1;

var el = document.getElementById（''xx''）：


if（！el.firstChild）{

el.appendChild （document.createTextNode（''''））;

}


countDown（stopMSec，el）;

}


window.onload = function（）{startCountDown（10,10）;}


< / script>


< div id =" xx" style =" font-weight：bold;">& nbsp;< / div>


-

Rob

I am updating a website that uses a countdown script embedded on the
page. When the page is served the var''s are set to how long the
countdown has left in minutes and seconds, but the rest of the script
is left untouched.

However I want to take the script out of the page and have it as a
seperate file that can be cached, reducing serving costs - the page
gets hit a couple of thousand times per day, sometimes as high a 5K, so
any savings are multiplied.

The original script is:
----------
var min=40;
var sec=40;

function countdown()
{
if (sec==0 && min>0)
{ sec=59; min--; }
else
{ sec--; }

msg = ''<b>Next Tick: '' + min + '':'' + ((sec < 10) ? ''0'' : '''') + sec +
''</b>'';

if (document.all)
document.all.tel.innerHTML = msg;
else if (document.getElementById(''tel''))
document.getElementById(''tel'').innerHTML = msg;

if (sec==0 && min==0)
{ min=60; sec=00; }
if (sec>0 || min>0)
setTimeout(''countdown()'',1000);
}
window.onload=countdown;
----------
Note: the var are set to 40 for testing purposes. In the actual script
they are set to the time that is left on the server.

So I thought the easiest way to do this would make the function accept
two vars, and then pass the parameters to the function from within the
html.

However the closest I can get is this:
----------
function countdown(m, s)
{
sec = s;
min = m;

if (sec==0 && min>0)
{ sec=59; min--; }
else
{ sec--; }

msg = ''<b>Next Tick: '' + min + '':'' + ((sec < 10) ? ''0'' : '''') + sec +
''</b>'';

if (document.all)
document.all.tel.innerHTML = msg;
else if (document.getElementById(''tel''))
document.getElementById(''tel'').innerHTML = msg;

if (sec==0 && min==0)
{ min=60; sec=00; }
if (sec>0 || min>0)
setTimeout("countdown(min,sec)",1000);
}
window.onload=countdown(40,40);
----------
And this code only works in FF - it stops working in IE6. As soon as I
move the ''window.onload'' line out of the .js file and into the HTML
code it stops working in FF too. I thought the code would be the
following, contained in <head>:
----------
<script src="scripts/countdown.js" type="text/javascript">
<!--
window.onload=countdown(40,40);
//-->
</script>
----------

What do I need to do to get this working?

Thanks, Graham Reeds.

解决方案

gr**********@gmail.com wrote:

I am updating a website that uses a countdown script embedded on the
page. When the page is served the var''s are set to how long the
countdown has left in minutes and seconds, but the rest of the script
is left untouched.

However I want to take the script out of the page and have it as a
seperate file that can be cached, reducing serving costs - the page
gets hit a couple of thousand times per day, sometimes as high a 5K, so
any savings are multiplied.

The original script is:
----------
var min=40;
var sec=40;

function countdown()
{
if (sec==0 && min>0)
{ sec=59; min--; }
else
{ sec--; }

msg = ''<b>Next Tick: '' + min + '':'' + ((sec < 10) ? ''0'' : '''') + sec +
''</b>'';

if (document.all)
document.all.tel.innerHTML = msg;
else if (document.getElementById(''tel''))
document.getElementById(''tel'').innerHTML = msg;

if (sec==0 && min==0)
{ min=60; sec=00; }
Are you sure this condition can be reached? Aside from setting your var
sec and min to zero. Also sec = 0; will suffice.
if (sec>0 || min>0)
setTimeout(''countdown()'',1000);
}
window.onload=countdown;
Your original script appears to be correct. However, you must also
realize how big your page is. If your page is really big (has a lot of
content), then when your countdown function is called after 1 second,
is the "tel" id available at that point?
----------
Note: the var are set to 40 for testing purposes. In the actual script
they are set to the time that is left on the server.

So I thought the easiest way to do this would make the function accept
two vars, and then pass the parameters to the function from within the
html.

However the closest I can get is this:
----------
function countdown(m, s)
{
sec = s;
min = m;

if (sec==0 && min>0)
{ sec=59; min--; }
else
{ sec--; }

msg = ''<b>Next Tick: '' + min + '':'' + ((sec < 10) ? ''0'' : '''') + sec +
''</b>'';

if (document.all)
document.all.tel.innerHTML = msg;
else if (document.getElementById(''tel''))
document.getElementById(''tel'').innerHTML = msg;

if (sec==0 && min==0)
{ min=60; sec=00; }
if (sec>0 || min>0)
setTimeout("countdown(min,sec)",1000);
}
window.onload=countdown(40,40);
The problem here is also what I mentioned above. Plus, you now changed
your window.onload assignment to be that of the return value of
countdown, whereas in your original script, it was a reference to the
function.
----------
And this code only works in FF - it stops working in IE6. As soon as I
move the ''window.onload'' line out of the .js file and into the HTML
code it stops working in FF too. I thought the code would be the
following, contained in <head>:
----------
<script src="scripts/countdown.js" type="text/javascript">
<!--
window.onload=countdown(40,40);
//-->
</script>
----------
Move the window.onload=countdown; back into your external js file and
use the original code.
What do I need to do to get this working?

Thanks, Graham Reeds.

>Are you sure this condition can be reached? Aside from setting your var

sec and min to zero. Also sec = 0; will suffice.
No sec=0 won''t suffice. Just thinking about what the line does will
invalidate that statement. Just if sec > 0 won''t suffice because at
the end of a minute sec will be equal to zero and the countdown will
stop.
However, you must also realize how big your page is. If your page is really
big (has a lot of content), then when your countdown function is called after
1 second, is the "tel" id available at that point?
That''s why the window.onload event is used. The window.onload event is
triggered once the page has finished loading.
Move the window.onload=countdown; back into your external js file and
use the original code.

As I stated in my original post the site embedded the javascript into
the page and changed the two values when the page was generated. I
want to take the javascript out of the page to a seperate file but I
still need to be able to send the two values to the function. The 40,
40 values are just there so I can see if my changes break the code in
anyway.

G.

gr**********@gmail.com wrote:

I am updating a website that uses a countdown script embedded on the
page. When the page is served the var''s are set to how long the
countdown has left in minutes and seconds, but the rest of the script
is left untouched.

However I want to take the script out of the page and have it as a
seperate file that can be cached, reducing serving costs - the page
gets hit a couple of thousand times per day, sometimes as high a 5K, so
any savings are multiplied.
[...]
if (document.all)
document.all.tel.innerHTML = msg;
else if (document.getElementById(''tel''))
document.getElementById(''tel'').innerHTML = msg;
That test would be more appropriately applied as:

if (document.getElementById) {
document.getElementById(''tel'').innerHTML = msg;
} else if (document.all){
document.all[''tel''].innerHTML = msg;
}

since there are probably more browsers around that understand
getElementById than document.all.

if (sec==0 && min==0)
{ min=60; sec=00; }
if (sec>0 || min>0)
setTimeout(''countdown()'',1000);
setTimeout is not guaranteed to run at precisely the interval specified.

Depending on the accuracy you require (either for the whole interval or
for each tick), a better solution might be to get the local time, add
your offset, then do a countdown based on that. Run the count down at
about 200ms intervals so that you don''t miss a ''tick'' of the clock by
too much, or more frequently if you feel the need - but take account of
other scripts you may have running and what the overall workload on the
users PC will be.

}
window.onload=countdown;
There are no parenthesis here - window.onload is being passed a
reference to a function, which is the normal thing to do. Your new
window.onload is quite different (see below).
[...] However the closest I can get is this:
----------
function countdown(m, s)
{
sec = s;
min = m;
That seems rather pointless, why not just use m & s throughout the rest
of the script, or use:

function countdown(min, sec)


if (sec==0 && min>0)
{ sec=59; min--; }
else
{ sec--; }

msg = ''<b>Next Tick: '' + min + '':'' + ((sec < 10) ? ''0'' : '''') + sec +
Seconds are padded with a leading zero, why not the minutes too?
[...]
if (sec==0 && min==0)
{ min=60; sec=00; }
This ensures that your timer never expires (whether you use 00 or 0) -
it is re-set to 60 minutes when it runs down. Why do you think you need
00 rather than 0?

if (sec>0 || min>0)
if (sec || min)

will do.

setTimeout("countdown(min,sec)",1000);
If you want to pass reference to variables from this function to the next:

if (sec || min){
setTimeout(function(){
countdown(min, sec);
}, 1000);
}

}
window.onload=countdown(40,40);
Here you pass the result of the function to window.onload - it is
executed immediately, most likely before the rest of the page has loaded.

If you keep using global variables, then use the same statement as that
above. If you want to call the function with parameters, use:

window.onload = function() { countdown(40,40); }

----------
And this code only works in FF - it stops working in IE6. As soon as I
move the ''window.onload'' line out of the .js file and into the HTML
code it stops working in FF too. I thought the code would be the
And what error message do you get? Something like ''object expected'' or
similar?
following, contained in <head>:
----------
<script src="scripts/countdown.js" type="text/javascript">
<!--
Don''t use HTML comment delimiters inside script tags, it can have
unwanted side-effects and serves no useful purpose.

window.onload=countdown(40,40);
This assigns the *result* of running countdown to window.onload. Since
it doesn''t return anything, it isn''t run onload. countdown is run
immediately, and I suspect it works sometimes when in a .js file because
the file loads slowly enough that by the time it is executed, the ''tel''
element exists. If it doesn''t, the script errors.
//-->
</script>
----------

What do I need to do to get this working?

The entire following script can be placed in an external file. If you
want to use global variables in the HTML file, put them in the HTML
inside a script element and use them:
<script type="text/javascript">

function countDown(t, el)
{
var tLeft = t - new Date().getTime();
var mLeft = Math.floor(tLeft/60000);
var sLeft = Math.floor((tLeft%60000)/1000);

mLeft = (mLeft<10)? ''0''+mLeft : mLeft;
sLeft = (sLeft<10)? ''0''+sLeft : sLeft;
el.firstChild.data = mLeft + '':'' + sLeft;

if (tLeft > 1000) {
setTimeout( function() {
countDown(t, el);
}, 200);
}
}

function startCountDown(min, sec)
{
if (!document.getElementById || !document.createTextNode) return;
var stopMSec = new Date().getTime() + (min*60 + sec)*1000 - 1;
var el = document.getElementById(''xx''):

if (!el.firstChild) {
el.appendChild(document.createTextNode('' ''));
}

countDown(stopMSec, el);
}

window.onload = function() {startCountDown(10,10);}

</script>

<div id="xx" style="font-weight: bold;">&nbsp;</div>


--
Rob

这篇关于从html代码中删除和事件。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！