如何使用多个相同的ID？ [英] How to use multiple same ID?
问题描述
只有第一个< div>在以下代码中执行。我希望
秒也可以执行。这段代码是动态生成的，所以我不知道究竟有多少< div>将需要标签。如果他们都可以使用相同的ID /名称，那么这不应该是一个问题。另外，使用按钮代替
，我会在页面加载时执行fadetext（）。
有什么建议吗？
谢谢，
Brett
<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.01 Transitional // EN">
< html>
< head>
< title>无标题< / title>
< / head>
< body>
< script type =" text / javascript">
/ *灰色
RGB（184,184,184）＃B8B8B8
RGB（192,192,192）＃C0C0C0
RGB（200,200,200）＃C8C8C8
RGB（208,208,208）＃D0D0D0
RGB（216,216,216）＃D8D8D8
RGB（224,224,224）＃E0E0E0
RGB（232,232,232） ＃E8E8E8
RGB（240,240,240）＃F0F0F0
RGB（248,248,248）＃F8F8F8
RGB（255,255,255）#FFFFFF
* /
十六进制= 224 //初始颜色值。
函数fadetext（）{
if（hex> 0）{//如果颜色是n ot black
hex- = 11; //增加颜色暗度
document.getElementById（" sample"）。style.color =
" rgb（" + hex +"，" + hex +"，" + hex +"）" ;;
// setTimeout（" fadetext（）"，20）;
}
}
< / script>
< div id =" sample" style =" width：100％">< h3> John慢慢消失了
查看< / h3>< / div>
此区域不会淡出。< br>
< div id =" sample" style =" width：100％">< h3>发生另一次淡入淡出
此处。< / h3>< / div>
< button onClick =" fadetext（）">淡化文字< / button>
< / body>
< / html>
Only the first <div> executes in the following code. I''d like the
second to execute as well. This code is dynamically generated so I
won''t know exactly how many <div> tags will be needed. If they can all
use the same ID/Name that shouldn''t be a problem. Also, instead of
using a button, I''ll execute fadetext() on page load.
Any suggestions?
Thanks,
Brett
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script type="text/javascript">
/* grays
RGB(184,184,184) #B8B8B8
RGB(192,192,192) #C0C0C0
RGB(200,200,200) #C8C8C8
RGB(208,208,208) #D0D0D0
RGB(216,216,216) #D8D8D8
RGB(224,224,224) #E0E0E0
RGB(232,232,232) #E8E8E8
RGB(240,240,240) #F0F0F0
RGB(248,248,248) #F8F8F8
RGB(255,255,255) #FFFFFF
*/
hex=224 // Initial color value.
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementById("sample").style.color=
"rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
</script>
<div id="sample" style="width:100%"><h3>John slowly faded into
view</h3></div>
This area will not fade out.<br>
<div id="sample" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<button onClick="fadetext()">Fade Text</button>
</body>
</html>
推荐答案
brett写道：
brett wrote:
只有第一个< div>在以下代码中执行。我希望
第二个也能执行。这段代码是动态生成的，所以我不确切地知道有多少< div>将需要标签。如果他们都可以使用相同的ID /名称，这不应该是一个问题。另外，不是使用按钮，我会在页面加载时执行fadetext（）。
有什么建议吗？
谢谢，
Brett
您可以根据需要多次使用任何ID标签。但是，在你使用
指定的ID迭代所有元素之前，它不会工作
。不是css问题！
<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.01 Transitional // EN">
< ; html>
< head>
< title> Untitled< / title>
< / head>
< body>
< ; script type =" text / javascript">
/ * grays
RGB（184,184,184）＃B8B8B8
RGB（192,192,192）＃C0C0C0
RGB（200,200,200）＃C8C8C8
RGB（208,208,208）＃D0D0D0
RGB（216,216,216）＃D8D8D8
RGB（224,224,224）＃E0E0E0
RGB（232,232,232）＃E8E8E8
RGB（240,240,240）＃F0F0F0
RGB（248,248,248）＃F8F8F8
RGB（255,255,255）#FFFFFF
* /
hex = 224 //初始颜色值。
函数fadetext（） {
if（hex> 0）{//如果颜色不是黑色的话
hex- = 11; //增加颜色暗度
document.getElementById（" sample"）。style.color =
" rgb（" + hex +"，" + hex +"，" + hex +"）" ;;
// setTimeout（" fadetext（）"，20）;
}
< / script>
< div id =" sample" style =" width：100％">< h3> John慢慢淡入
视图< / h3>< / div>
此区域不会淡出。< br>
< div id =" sample" style =" width：100％">< h3>此处发生了另一次淡出。
< / h3>< / div>
< button onClick =" fadetext（）" ;>淡化文字< / button>
< / body>
< / html>
Only the first <div> executes in the following code. I''d like the
second to execute as well. This code is dynamically generated so I
won''t know exactly how many <div> tags will be needed. If they can all
use the same ID/Name that shouldn''t be a problem. Also, instead of
using a button, I''ll execute fadetext() on page load.
Any suggestions?
Thanks,
Brett
you can use any ID tag as many times as you want. however, it wont work
until you get your javascript to iterate over all elements with the
specified ID. not a css problem !
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script type="text/javascript">
/* grays
RGB(184,184,184) #B8B8B8
RGB(192,192,192) #C0C0C0
RGB(200,200,200) #C8C8C8
RGB(208,208,208) #D0D0D0
RGB(216,216,216) #D8D8D8
RGB(224,224,224) #E0E0E0
RGB(232,232,232) #E8E8E8
RGB(240,240,240) #F0F0F0
RGB(248,248,248) #F8F8F8
RGB(255,255,255) #FFFFFF
*/
hex=224 // Initial color value.
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementById("sample").style.color=
"rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
</script>
<div id="sample" style="width:100%"><h3>John slowly faded into
view</h3></div>
This area will not fade out.<br>
<div id="sample" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<button onClick="fadetext()">Fade Text</button>
</body>
</html>
"布雷特" <交流***** @ cygen.com>写道：
你的样式表问题是什么？以下答案涉及您的帖子引发的
HTML和JavaScript问题。
"brett" <ac*****@cygen.com> wrote:
What''s your stylesheet question? The following answers relate to the
HTML and JavaScript issues that your post raises.
仅第一个< div>在以下代码中执行。我希望
第二个也能执行。这段代码是动态生成的，所以我不确切地知道有多少< div>将需要标签。如果他们都可以使用相同的ID /名称，这不应该是一个问题。
他们不能。
ID必须是唯一的，而NAME不是DIV的有效属性。
< ; script type =" text / javascript">
hex = 224 //初始颜色值。
函数fadetext（）{
if（hex> 0）{//如果颜色是不是黑色还是
hex- = 11; //增加颜色暗度
document.getElementById（" sample"）。style.color =
" rgb（" + hex +"，" + hex +"，" + hex +"）" ;;
// setTimeout（" fadetext（）"，20）;
}
}
< / script>
< div id =" sample" style =" width：100％">< h3> John慢慢淡入
视图< / h3>< / div>
此区域不会淡出。< br>
< div id =" sample" style =" width：100％">< h3>此处发生了另一次淡出。
< / h3>< / div>
< button onClick =" fadetext（）" ;>淡化文字< / button>
Only the first <div> executes in the following code. I''d like the
second to execute as well. This code is dynamically generated so I
won''t know exactly how many <div> tags will be needed. If they can all
use the same ID/Name that shouldn''t be a problem.
Well they can''t.
IDs must be unique and NAME is not a valid attribute for DIVs.
<script type="text/javascript">
hex=224 // Initial color value.
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementById("sample").style.color=
"rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
</script>
<div id="sample" style="width:100%"><h3>John slowly faded into
view</h3></div>
This area will not fade out.<br>
<div id="sample" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<button onClick="fadetext()">Fade Text</button>
给他们所有相同的CLASS。然后你可以使用
getElementsByTagName（''DIV''）在
页面中创建一个包含所有DIV的数组，然后通过该数组检查.className
属性匹配您要应用淡入淡出的类。进一步
关于DOM / JavaScript方面的问题将更好地在
comp.lang.javascript中询问
Steve
-
我的理论给你起见，我的异端邪说你愤怒，
我从不回信，你不喜欢我的领带。 - 医生
Steve Pugh< st *** @ pugh.net> < http://steve.pugh.net/>
Give them all the same CLASS. You can then use
getElementsByTagName(''DIV'') to create an array of all the DIVs in the
page and then go through that array checking that the .className
property matches the class you want to apply the fade to. Further
questions on the DOM/JavaScript aspects would be better asked in
comp.lang.javascript
Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don''t like my tie." - The Doctor
Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
brett写道：
brett wrote:
只有第一个< div> ;在以下代码中执行。我希望
第二个也能执行。这段代码是动态生成的，所以我不确切地知道有多少< div>将需要标签。如果他们都可以使用相同的ID /名称，这不应该是一个问题。另外，不是使用按钮，我会在页面加载时执行fadetext（）。
有什么建议吗？
谢谢，
Brett
<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.01 Transitional // EN">
< html>
< head>
< title> Untitled< / title>
< / head>
< body>
< script type =" text / javascript" ;>
/ *灰色
RGB（184,184,184）＃B8B8B8
RGB（192,192,192）＃C0C0C0
RGB（200,200,200）＃C8C8C8
RGB（208,208,208）＃D0D0D0
RGB（216,216,216）＃D8D8D8
RGB（224,224,224）＃E0E0E0
RGB（232,232,232）＃E8E8E8
RGB（240,240,240）＃F0F0F0
RGB（248,248,248）＃F8F8F8
RGB（255,255,255）#FFFFFF
* /
hex = 224 //初始颜色值。
函数fadetext（）{
if（hex> 0）{//如果颜色不是黑色那么
hex- = 11; //增加颜色暗度
document.getElementById（" sample"）。style.color =
" rgb（" + hex +"，" + hex +"，" + hex +"）" ;;
// setTimeout（" fadetext（）"，20）;
}
< / script>
< div id =" sample" style =" width：100％">< h3> John慢慢淡入
视图< / h3>< / div>
此区域不会淡出。< br>
< div id =" sample" style =" width：100％">< h3>此处发生了另一次淡出。
< / h3>< / div>
< button onClick =" fadetext（）" ;>淡化文字< / button>
< / body>
< / html>
Only the first <div> executes in the following code. I''d like the
second to execute as well. This code is dynamically generated so I
won''t know exactly how many <div> tags will be needed. If they can all
use the same ID/Name that shouldn''t be a problem. Also, instead of
using a button, I''ll execute fadetext() on page load.
Any suggestions?
Thanks,
Brett
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script type="text/javascript">
/* grays
RGB(184,184,184) #B8B8B8
RGB(192,192,192) #C0C0C0
RGB(200,200,200) #C8C8C8
RGB(208,208,208) #D0D0D0
RGB(216,216,216) #D8D8D8
RGB(224,224,224) #E0E0E0
RGB(232,232,232) #E8E8E8
RGB(240,240,240) #F0F0F0
RGB(248,248,248) #F8F8F8
RGB(255,255,255) #FFFFFF
*/
hex=224 // Initial color value.
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementById("sample").style.color=
"rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
</script>
<div id="sample" style="width:100%"><h3>John slowly faded into
view</h3></div>
This area will not fade out.<br>
<div id="sample" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<button onClick="fadetext()">Fade Text</button>
</body>
</html>
您不能拥有重复ID的元素但你可以复制
NAME更常见于表单字段...使用getElementsByName ...
####演示代码：
< html>
< head>
< script language =" JavaScript" type =" text / javascript">
<！ -
函数changeMe（n，i）{
var ones = document.getElementsByName（n）;
ones [i] .style.backgroundColor =" red";
}
// - >
< / script>
< / head>
< body>
< div name =" one">这是0< / div>
< div name =" one">这是1< / div>
< div name =" one">这是2< / div>
< div name =" one">这是3< / div>
< a href ="＃" onclick =" changeMe（''one''，0）">更改0< / a>< br>
< a href ="＃" onclick =" changeMe（''one''，1）">更改1< / a>< br>
< a href ="＃" onclick =" changeMe（''one''，2）"> Change 2< / a>< br>
< a href ="＃" onclick =" changeMe（''one''，3）">更改3< / a>< br>
< / body>
< ; / html>
-
保重，
Jonathan
---- ---------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
这篇关于如何使用多个相同的ID？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
