0

What are the preferences given for html control attributes if two attributes have same value like id="xyz" name="xyz" ?

My piece of code is as shown :

<iframe scrolling="no" width="100%" name="topFrame" id="topFrame" frameborder="0" height="100%" runat="server"></iframe>

I'm trying to access the iframe via the attribute. So when I call the iframe as javascript:parent.frames['topFrame'] with the value which one of them will be preferred

mplungjan
  • 169,008
  • 28
  • 173
  • 236
Abhishek N
  • 21
  • 6
  • preferences for what? These are different attributes used for different things. – Ivan Minakov Aug 21 '17 at 07:27
  • Attributes having the same values don't matter; they're unrelated. – MC Emperor Aug 21 '17 at 07:28
  • Your attributes do not have the same name, the have the same value. I have updated your question but do not understand what you are asking – mplungjan Aug 21 '17 at 07:29
  • i'm trying to access the iframe via the attribute. So when I call the iframe as javascript:parent.frames['topFrame'] with the value which one of them will be preffered? – Abhishek N Aug 21 '17 at 07:31

2 Answers2

0

Not all HTML objects can have names and naming anything but form elements is likely deprecated.

In your case preference is not relevant, but how you access the frame is:

Using the DOM access of parent.frames['topFrame'] will use the name except in browsers where the name/id or frames collection are is overloaded - but you will need location:

<a href="javascript:parent.frames['topFrame'].location='otherpage'">...

If you want to use the ID, you need src

<a href="javascript:parent.document.getElementById('topFrame').src='otherpage'">...
mplungjan
  • 169,008
  • 28
  • 173
  • 236
  • "will ALWAYS use name" — That isn't true: http://jsbin.com/kecubaqabo/1/edit?html,js,console – Quentin Aug 21 '17 at 07:55
  • @Quentin that is stupid browser implementation :( . Reminds me of IE's overloading of name so you can do document.getElementById("objectNAME") – mplungjan Aug 21 '17 at 07:59
  • It's required by the HTML 5 specification. – Quentin Aug 21 '17 at 08:22
  • @mplungjan I did the same to call a function. as javascript:parent.parent.frames['topFrame'].functionname(), but got the error as parent.frames.topFrame.functionname is not a function – Abhishek N Aug 21 '17 at 08:33
0

The first thing to note is that window.frames is just an alias for window:

The window, frames, and self IDL attributes must all return the Window object's browsing context's WindowProxy object.

The relevant part of the specification is here:

The supported property names at any moment consist of the following, in tree order, ignoring later duplicates:

  • the browsing context name of any child browsing context of the active document whose name is not the empty string,
  • the value of the name content attribute for all a, applet, area, embed, form, frameset, img, and object elements in the active document that have a non-empty name content attribute, and
  • the value of the id content attribute of any HTML element in the active document with a non-empty id content attribute.

So it doesn't matter which one is "preferred".

If the id and name of an element are the same, then one will be used to determine the name and the other will be ignored. If id="a" is used and name="a" is ignored, you get a. If it was the other way around, you would still get a.

If the id and name of an element are different, then they can both be used to reference it.

If two different elements share a value between their name and id attributes, then whichever element comes first will take that name. Which particular attribute is used doesn't matter.

Use of id and name attributes directly like that is not recommended. They can clash with existing properties of the window object. It is better to use getElementById or querySelector so you can explicitly say you are looking for an element in the DOM.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335