基础知识...解决js中的html元素 [英] Basics... addressing html elements in js

查看:49
本文介绍了基础知识...解决js中的html元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

具有name属性的元素:

form,input,textarea,a,frame,iframe,button,select,map,meta,

applet,object,param, img(如果你知道更多回复...)


添加html元素的方法:

< form name =" myform">

< input name =" myinput" />

< / form>

1. var input = document.forms.myform.myinput; //来自nn3 +

2 .var input = document.forms [" myform"]。myinput; //来自nn3 +

3. var input = document.forms [0] .myinput; //来自nn3 +,如果是第一页

in html


< form id =" myform">

< input name =" myinput" ; id =" myinput" />

< / form>

4. var input = document.all.myform.myinput; //来自ie4 +

5. var input = document.all [" myform"]。myinput; //来自ie4 +

6. var input = document.all(" myform")。myinput ; //来自ie4 +

7. var input = myform.myinput; //来自ie4 +,删除document.all

8. var input = document.all.item( " myform" .myinput; //来自ie4 +

9. var input = document.all.item(" myinput"); //来自ie4 +


10. var input = document.getElementById(" myinput"); // DOM


问题:

1.

我的问题是关于第1,2,3点所示的表格。这个表格是否适用于这样的形式(带有id,没有姓名attr):

< form id =" myform">

< / form>

....

document.forms.myform;

... 。

2.

不同的

浏览器是否支持表格1,2,3中显示的表格? (还有通过id attr和name attr支持地址)。


3.

表格是否显示在第4,5,6,7,8点, 9也可以使用形式,

只有名字attr(没有id):

< form name =" myform">

< / form>

....

document.all.myform;

....


4.

您是否知道在html中处理元素的不同方法,以及广泛使用的不同浏览器最常支持的
? />

感谢提前回答:)

解决方案

卢克在9/24上说了以下内容/ 2005 2:22 PM:

具有name属性的元素:
form,input,textarea,a,frame,iframe,button,select,map,meta,
applet,object,param,img(如果你知道更多回复...)


我知道更多。你可以在HTML部分的w3c网站上找到它们。


< URL: http://www.w3.org/TR/REC-html40/index/elements.html >


它显示了每个DTD的有效性。

添加html元素的方法:
< form name =" myform">
< input name =" myinput" />
< / form>
1. var input = document.forms.myform.myinput; //来自nn3 +
2. var input = document.forms [" myform" ] .myinput; //来自nn3 +
3. var input = document.forms [0] .myinput; //来自nn3 +,如果表格是第一个
in html


这3个中最好的是选择2.

< form id =" myform">
< input name =" myinput" id =" myinput" />
< / form>
4. var input = document.all.myform.myinput; //来自ie4 +
5. var input = document。 all [" myform"]。myinput; //来自ie4 +
6. var input = document.all(" myform")。myinput; //来自ie4 +
7. var input = myform。 myinput; //来自ie4 +,删除了document.all
8. var input = document.all.item(" myform")。myinput; //来自ie4 +
9. var input = document.all .item(" myinput"); //来自ie4 +


以上所有内容都是IE浏览器,应该被遗忘。

10. var input = document.getElementById(" myinput"); // DOM


如果你想要向后兼容,也忘了那个。

问题:
1.
我的问题是关于第1,2,3点所示的表格。这个表单是否可以应用于这样的表单(带有id,没有名称attr):
< form id =" myform">
< / form> ;
....
document.forms.myform;


是的。仅限姓名。但是使用选择2。

....
2.
点1,2,3中显示的表单是否得到不同浏览器的支持? (还有通过id attr和name attr支持地址)。


访问表单控件的最跨浏览器方式是:


document.forms [''formNAMEnotID'']。elements [ ''elementNAMEnotID'']。value


< form name =" formNAMEnotID">

< input name =" elementNAMEnotID">


除了NN4和Radio元素中的选择列表,只需

关于地球上的每个浏览器。

3。
点4,5,6,7,8,9中显示的表单是否也可以与
只有名称attr(没有id)的表单一起使用:
< form name =" ; myform">
< / form>
....
document.all.myform;
....


可能是因为IE如此搞砸了它的document.all集合。

但它只是IE语法,所以要避免它。


在基于Gecko的浏览器中有一个例外,但我对

的看法发生了,这是Gecko的一个愚蠢的错误

开发者。

4.
你知道不同的方法来解决html中的元素吗?哪些是最常见的广泛支持的浏览器?



这取决于元素,我不觉得拿W3C列表

并显示访问每个元素的不同方式。


-

兰迪

comp.lang.javascript常见问题 - http://jibbering.com/faq &新闻组每周




Randy Webb napisal(a):

Luke在9/24/2005上说了以下内容2:22 PM:

具有name属性的元素:
form,input,textarea,a,frame,iframe,button,select,map,meta,
applet,object,param,img(如果你知道更多回复......)
我知道更多。你可以在HTML部分的w3c网站上找到它们。

< URL: http://www.w3.org/TR/REC-html40/index/elements.html >



我在上面列出了所有内容...

在HTML 4.01中严格地说一个名为attr的元素。

已弃用(采取的形式
http://www.w3.org/TR/html401/index/attributes.html):

按钮

textarea

applet(名称attr。弃用...代替使用对象)

选择

表格

frame(仅限于框架集) dtd)

iframe(仅限于框架集dtd)

img

a

输入

对象

地图

param

meta

所以我可以通过它来解决其中的一些元素 - > name< - attribute by

使用文档数组,例如:

document.anchors [](用于< a name ="" ...>元素)

document.applets [](对于< applet name ="" ...>在html 401中弃用

元素)

document.forms [](用于< form name ="" ..>元素)

document.links [](用于< a name ="" href =" "> ele ments)

document.images [](适用于< img name ="">元素)

document.frames [](对于< frame name ="">和< iframe name ="">)

,并且

document.embeds [](对于html 401中删除的< embed name ="">元素

规格)。

document.layers [](仅适用于NN4< layer name ="">元素)


,对于列表中的其他元素,即:

对象

地图

param

meta

a必须使用基于DOM的地址

document.getElementByName(" nameNotID"); //自IE5 +,

NN6 +,Mozilla,Safari

或更好

document.getElementById(" IDNotName); //如果我正在使用id',因为IE5 +,

NN6 +,Mozilla,Safari

访问表单控件的最跨浏览器方式是:

document.forms [''formNAMEnotID'']。elements [''elementNAMEnotID'']。value

< form name =" formNAMEnotID">
< input name =" elementNAMEnotID">
谢谢你,在我看到你的回复之前,我还处在黑暗中。

除了NN4中的选择列表和关于地球上每个浏览器的无线电元素。



所以有例外吗? :(所以如果我们有这样的形式:

< form name =" myFormName">

< input type =" radio" name =" myRadio" value ="是" />是

< input type =" radio" name =" myRadio" value =" No" /> No

< / form>


所以我可以像这样添加第一个收音机(?):

var firstRadio = document.forms [" myFormName"]。elements [" myRadio"] [0];

(以及同名的复选框)。


,以及for select像这样:

< form name =" myFormName">

< select name =" mySelect">

< ;选项值="是">是< /选项>

<选项值="否">否< /选项>

< /选择>

< / form>

i可以解决它(跨浏览器),如下所示:

var mySelect = document.forms [" ; myFormName"]元素["。mySe lect"]; // for

< select>

and,

var firstOption =

document。 form [" myFormName"]。elements [" mySelect"]。options [0]; // for

第一个选项元素


感谢您的回答提前。





Luke写道:

Randy Webb napisal(a):


访问表单控件的最跨浏览器方式是:
document.forms [''formNAMEnotID'']。elements [''elementNAMEnotID'']。value

除了NN4中的选择列表和关于每个浏览器的无线电元素外在这个星球上。



所以有异常吗?




< select>的例外情况元素和上面的表达式在

中Netscape 4是< select>的值属性本身总是

null所以当访问控件当然是

document.forms [''formNAMEnotID'']。elements [''elementNAMEnotID'']

上面的完整表达式是

document.forms [''formNAMEnotID'']。elements [''elementNAMEnotID'']。value

和在Netscape 4中给出null并因此没用。所以对于一个

选择及其值,如果你想覆盖Netscape 4,你需要例如

var select =

document.forms ['' formNAMEnot'']。elements [''elementNAMEnotID''];

if(select.selectedIndex> -1){

var value = select.options [select。 selectedIndex] .value;

}

-


Martin Honnen
http://JavaScript.FAQTs.com/


Elements with name attribute:
form, input, textarea, a, frame, iframe, button, select, map, meta,
applet, object, param, img (if you know more reply...)

Methods of addresing html elements:
<form name="myform">
<input name="myinput" />
</form>
1. var input = document.forms.myform.myinput;//from nn3+
2. var input = document.forms["myform"].myinput;//from nn3+
3. var input = document.forms[0].myinput;//from nn3+, if form is first
in html

<form id="myform">
<input name="myinput" id="myinput"/>
</form>
4. var input = document.all.myform.myinput;//from ie4+
5. var input = document.all["myform"].myinput;//from ie4+
6. var input = document.all("myform").myinput;//from ie4+
7. var input = myform.myinput;//from ie4+, dropped document.all
8. var input = document.all.item("myform").myinput;//from ie4+
9. var input = document.all.item("myinput");//from ie4+

10. var input = document.getElementById("myinput");//DOM

Questions:
1.
My question is about form showed in points 1,2,3. Does this form can be

applied to form like this (with id, without name attr):
<form id="myform">
</form>
....
document.forms.myform;
....
2.
Does forms showed in points 1,2,3 are most supported by different
browsers ? (also with support addresing via id attr and name attr).

3.
Does forms showed in points 4,5,6,7,8,9 can also be used with form that
have only name attr (without id):
<form name="myform">
</form>
....
document.all.myform;
....

4.
Do you know different ways of addressing elements in html and which is
most commonly supported by wide spread of different browsers ?

Thanks for answer in advance :)

解决方案

Luke said the following on 9/24/2005 2:22 PM:

Elements with name attribute:
form, input, textarea, a, frame, iframe, button, select, map, meta,
applet, object, param, img (if you know more reply...)
I know a lot more. You can find them in the w3c site in the HTML sections.

<URL: http://www.w3.org/TR/REC-html40/index/elements.html >

And it shows what DTD''s each are valid in.
Methods of addresing html elements:
<form name="myform">
<input name="myinput" />
</form>
1. var input = document.forms.myform.myinput;//from nn3+
2. var input = document.forms["myform"].myinput;//from nn3+
3. var input = document.forms[0].myinput;//from nn3+, if form is first
in html
The best of those 3 is choice 2.
<form id="myform">
<input name="myinput" id="myinput"/>
</form>
4. var input = document.all.myform.myinput;//from ie4+
5. var input = document.all["myform"].myinput;//from ie4+
6. var input = document.all("myform").myinput;//from ie4+
7. var input = myform.myinput;//from ie4+, dropped document.all
8. var input = document.all.item("myform").myinput;//from ie4+
9. var input = document.all.item("myinput");//from ie4+
All of the above are IE-only and should be forgotten.
10. var input = document.getElementById("myinput");//DOM
Forget that one also if you want backwards compatability.
Questions:
1.
My question is about form showed in points 1,2,3. Does this form can be

applied to form like this (with id, without name attr):
<form id="myform">
</form>
....
document.forms.myform;
Yes. With name only. Use choice 2 though.
....
2.
Does forms showed in points 1,2,3 are most supported by different
browsers ? (also with support addresing via id attr and name attr).
The most cross-browser way to access a form control is:

document.forms[''formNAMEnotID''].elements[''elementNAMEnotID''].value

<form name="formNAMEnotID">
<input name="elementNAMEnotID">

With the exception of select lists in NN4 and Radio elements in just
about every browser on the planet.
3.
Does forms showed in points 4,5,6,7,8,9 can also be used with form that
have only name attr (without id):
<form name="myform">
</form>
....
document.all.myform;
....
Probably so as IE is so screwed up with it''s document.all collection.
But it''s IE-only syntax so avoid it.

There is an exception to that in Gecko based browsers but my opinion of
that happening is that it was a stupid mistake on the part of the Gecko
developers.
4.
Do you know different ways of addressing elements in html and which is
most commonly supported by wide spread of different browsers ?



That depends on the element and I don''t feel like taking that W3C list
and showing the different ways to access each.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly



Randy Webb napisal(a):

Luke said the following on 9/24/2005 2:22 PM:

Elements with name attribute:
form, input, textarea, a, frame, iframe, button, select, map, meta,
applet, object, param, img (if you know more reply...)
I know a lot more. You can find them in the w3c site in the HTML sections.

<URL: http://www.w3.org/TR/REC-html40/index/elements.html >


I listed all above...
Stricly speaking in HTML 4.01 one element with name attr. is
deprecated(taken form
http://www.w3.org/TR/html401/index/attributes.html):
button
textarea
applet (name attr. deprecated... use object instead)
select
form
frame (only in frameset dtd)
iframe (only in frameset dtd)
img
a
input
object
map
param
meta
So i can address some of those elements via its ->name<- attribute by
using document arrays like:
document.anchors[] (for <a name=""...> elements)
document.applets[] (for <applet name=""...> deprecated in html 401
elements)
document.forms[] (for <form name=""..> elements)
document.links[] (for <a name="" href=""> elements)
document.images[] (for <img name=""> elements)
document.frames[] (for <frame name=""> and <iframe name="">)
, and
document.embeds[] (for dropped <embed name=""> elements in html 401
specs).
document.layers[] (for only NN4 <layer name=""> elements)

, for rest elements in the list, that is:
object
map
param
meta
a must use DOM based addresing by
document.getElementByName("nameNotID"); //since IE5+,
NN6+,Mozilla,Safari
or better
document.getElementById("IDNotName); //if i am using id''s, since IE5+,
NN6+,Mozilla,Safari
The most cross-browser way to access a form control is:

document.forms[''formNAMEnotID''].elements[''elementNAMEnotID''].value

<form name="formNAMEnotID">
<input name="elementNAMEnotID"> Thanks for that, i was in dark before i read your reply :)
With the exception of select lists in NN4 and Radio elements in just
about every browser on the planet.


So there is exception ? :( So if we have form like this:
<form name="myFormName">
<input type="radio" name="myRadio" value="Yes" />Yes
<input type="radio" name="myRadio" value="No" />No
</form>

so i can addres the first radio like this(?):
var firstRadio = document.forms["myFormName"].elements["myRadio"][0];
(and for checkboxes with the same name too).

, and for select like this:
<form name="myFormName">
<select name="mySelect">
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</form>
i can address it (cross-browser) like this:
var mySelect = document.forms["myFormName"].elements["mySelect"];//for
<select>
and,
var firstOption =
document.forms["myFormName"].elements["mySelect"].options[0];//for
first option element

Thanks for answer in advance.




Luke wrote:

Randy Webb napisal(a):


The most cross-browser way to access a form control is:

document.forms[''formNAMEnotID''].elements[''elementNAMEnotID''].value
With the exception of select lists in NN4 and Radio elements in just
about every browser on the planet.



So there is exception ?



The exception with <select> elements and the above expression in
Netscape 4 is that the value property of the <select> itself is always
null so while the access to the control is of course
document.forms[''formNAMEnotID''].elements[''elementNAMEnotID'']
the complete expression above is
document.forms[''formNAMEnotID''].elements[''elementNAMEnotID''].value
and that gives null in Netscape 4 and is therefore not useful. So for a
select and its value if you want to cover Netscape 4 you need e.g.
var select =
document.forms[''formNAMEnotID''].elements[''elementNAMEnotID''];
if (select.selectedIndex > -1) {
var value = select.options[select.selectedIndex].value;
}
--

Martin Honnen
http://JavaScript.FAQTs.com/


这篇关于基础知识...解决js中的html元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆