Jaka jest różnica między atrybutami ida name? Oba wydają się służyć temu samemu celowi, jakim jest dostarczenie identyfikatora.

Chciałbym wiedzieć (szczególnie w odniesieniu do formularzy HTML), czy korzystanie z obu jest konieczne lub zalecane z jakichkolwiek powodów.

nameAtrybut jest używany podczas wysyłania danych w przedłożeniu formularza. Różne elementy sterujące reagują inaczej. Na przykład możesz mieć kilka przycisków opcji o różnych idatrybutach, ale takich samych name. Po przesłaniu w odpowiedzi jest tylko jedna wartość - wybrany przycisk opcji.

Oczywiście jest w tym coś więcej, ale na pewno sprawi, że zaczniesz myśleć we właściwym kierunku.

Użyj nameatrybutów do kontrolek formularza (takich jak <input>i <select>), ponieważ jest to identyfikator użyty w wywołaniu POSTlub, GETktóre ma miejsce podczas przesyłania formularza.

Używaj idatrybutów, gdy potrzebujesz zaadresować określony element HTML za pomocą CSS, JavaScript lub identyfikatora fragmentu . Możliwe jest również wyszukiwanie elementów według nazwy, ale łatwiejsze i bardziej niezawodne jest wyszukiwanie ich według identyfikatora.

Oto krótkie podsumowanie:

• idsłuży do identyfikacji elementu HTML za pomocą modelu obiektowego dokumentu (przez JavaScript lub stylem CSS). idoczekuje się, że będzie unikalny na stronie.

• nameodpowiada elementowi formularza i identyfikuje to, co jest wysyłane z powrotem na serwer .

Zobacz http://mindprod.com/jgloss/htmlforms.html#IDVSNAME

Co za różnica? Krótka odpowiedź brzmi: używaj obu i nie martw się o to. Ale jeśli chcesz zrozumieć tę głupotę, oto chuda:

ID = ma być stosowany jako cel w ten sposób: <some-element id="XXX"></some-element>dla łączy jak poniżej: <a href="#XXX".

name = służy również do oznaczania pól w wiadomości wysyłanej do serwera za pomocą HTTP (HyperText Transfer Protocol) GET lub POST po naciśnięciu przycisku przesyłania w formularzu.

id = oznacza pola do użycia przez JavaScript i Java DOM (Document Object Model). Nazwy w name = muszą być unikalne w formularzu. Nazwy w id = muszą być unikalne w całym dokumencie.

Czasami nazwy = i id = nazwy będą się różnić, ponieważ serwer oczekuje tej samej nazwy z różnych formularzy w tym samym dokumencie lub różnych przycisków opcji w tej samej formie, jak w powyższym przykładzie. Identyfikator = musi być unikalny; nazwa = nie może być.

JavaScript potrzebował unikalnych nazw, ale było już zbyt wiele dokumentów bez unikalnych nazw = nazw, więc ludzie z W3 wymyślili tag id, który był wymagany. Niestety starsze przeglądarki tego nie rozumiały. Potrzebujesz więc obu schematów nazewnictwa w swoich formularzach.

UWAGA: atrybut „name” dla niektórych tagów, takich jak, <a>nie jest obsługiwany w HTML5.

Sposób, w jaki o tym myślę i korzystam jest prosty:

identyfikator jest używany w CSS i JavaScript / jQuery (musi być unikalny na stronie)

nazwa jest używana do obsługi formularzy w PHP, gdy formularz jest przesyłany przez HTML (musi być unikalny w formularzu - do pewnego stopnia zobacz komentarz Pawła poniżej)

Znacznik ID - używany przez CSS, definiuje unikalne wystąpienie div, span lub innych elementów. Pojawia się w modelu JavaScript DOM, umożliwiając dostęp do nich za pomocą różnych wywołań funkcji.

Tag nazwy dla pól - jest unikalny dla każdego formularza - chyba że wykonujesz tablicę, którą chcesz przekazać do przetwarzania PHP / po stronie serwera. Możesz uzyskać do niego dostęp przez Javascript według nazwy, ale myślę, że nie pojawia się on jako węzeł w DOM lub mogą obowiązywać pewne ograniczenia (nie możesz użyć .innerHTML, na przykład, jeśli dobrze pamiętam).

Ogólnie przyjmuje się, że nazwa jest zawsze zastępowana przez id . Jest to do pewnego stopnia prawdziwe, ale praktycznie nie dotyczy pól formularzy i nazw ram . Na przykład w przypadku elementów formularza nameatrybut służy do określania par nazwa-wartość, które mają zostać wysłane do programu po stronie serwera, i nie należy go eliminować. Browsers do not use id in that manner. Aby być bezpiecznym, możesz użyć atrybutów name i id w elementach formularza. Napiszemy więc:

<form id="myForm" name="myForm">
     <input type="text" id="userName" name="userName" />
</form>

Aby zapewnić zgodność, dobrym pomysłem jest posiadanie zgodnych wartości atrybutów nazwa i identyfikator, gdy są one zdefiniowane. Bądź jednak ostrożny - niektóre tagi, zwłaszcza przyciski opcji, muszą mieć nietypowe nazwy, ale wymagają unikalnych wartości identyfikatora. Raz jeszcze powinno to oznaczać, że identyfikator nie jest po prostu zamiennikiem nazwy; mają inny cel. Co więcej, nie pomijaj starego stylu, głębokie spojrzenie na współczesne biblioteki pokazuje taki styl składni używany czasami do celów wydajnościowych i łatwości. Twoim celem zawsze powinna być zgodność.

Teraz w większości elementów atrybut name został wycofany na korzyść bardziej wszechobecnego atrybutu id. Jednak w niektórych przypadkach, szczególnie tworząc pola ( <button>, <input>, <select>, i <textarea>), życie na atrybut name, ponieważ nadal jest wymagane, aby ustawić parę nazwa-wartość składania formularza. Ponadto okazuje się, że niektóre elementy, w szczególności ramki i łącza, mogą nadal używać atrybutu name, ponieważ często jest on przydatny do wyszukiwania tych elementów według nazwy.

Istnieje wyraźne rozróżnienie między identyfikatorem a nazwą. Bardzo często, gdy nazwa jest kontynuowana, możemy ustawić te same wartości. Jednak identyfikator musi być unikalny, a nazwa w niektórych przypadkach nie powinna - pomyśl przyciski radiowe. Niestety, wyjątkowość wartości identyfikacyjnych, choć wychwycona przez sprawdzanie poprawności znaczników, nie jest tak spójna, jak powinna być. Implementacja CSS w przeglądarkach będzie stylizować obiekty o wspólnej wartości id; dlatego nie możemy wyłapać błędów znaczników lub stylów, które mogłyby wpłynąć na nasz JavaScript do czasu uruchomienia.

To pochodzi z książki JavaScript- The Complete Reference by Thomas-Powell

namejest przestarzałe dla celów linków i jest nieprawidłowe w HTML5. Nie działa już przynajmniej w najnowszej przeglądarce Firefox (v13). Zmień <a name="hello">na<a id="hello">

Cel nie musi być <a>tagiem, może być <p id="hello"> lub <h2 id="hello">itp., Co często jest czystszym kodem.

Jak wyraźnie mówią inne posty, namejest nadal używany (potrzebny) w formularzach. Jest nadal używany w tagach META.

<form action="demo_form.asp">
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="sex" id="female" value="female"><br>
<input type="submit" value="Submit">
</form>

Ten link zawiera odpowiedzi na to samo podstawowe pytanie, ale w zasadzie identyfikator służy do identyfikacji skryptu, a nazwa jest po stronie serwera.

http://www.velocityreviews.com/forums/t115115-id-vs-name-attribute-for-html-controls.html

name Vs id

imię

• Nazwa elementu Na przykład używany przez serwer do identyfikacji pól w formularzach przesyłanych.
• Elementy wspierające są <button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param>
• Nazwa nie musi być unikalna.

ID

• Często używany z CSS do stylizowania określonego elementu. Wartość tego atrybutu musi być unikalna.
• Id to Globalne atrybuty , można ich używać we wszystkich elementach, chociaż atrybuty mogą nie mieć wpływu na niektóre elementy.
• Musi być unikalny w całym dokumencie.
• Wartość tego atrybutu nie może zawierać białych spacji, w przeciwieństwie do atrybutu class, który pozwala na wartości oddzielone spacją.
• Używanie znaków oprócz liter i cyfr ASCII, „_”, „-” i „.” może powodować problemy ze zgodnością, ponieważ nie były one dozwolone w HTML 4. Chociaż ograniczenie to zostało zniesione w HTML 5, identyfikator powinien zaczynać się od litery oznaczającej zgodność.

Identyfikator elementu wejściowego formularza nie ma nic wspólnego z danymi zawartymi w elemencie. Identyfikatory służą do zaczepiania elementu za pomocą JavaScript i CSS. Jednak atrybut name jest wykorzystywany w żądaniu HTTP wysyłanym przez przeglądarkę do serwera jako nazwa zmiennej powiązana z danymi zawartymi w atrybucie value.

Na przykład:

<form>
    <input type="text" name="user" value="bob">
    <input type="password" name="password" value="abcd1234">
</form>

Po przesłaniu formularza dane formularza zostaną uwzględnione w nagłówku HTTP w następujący sposób:

Dodanie atrybutu ID nie zmieni niczego w nagłówku HTTP. Ułatwi to połączenie CSS i JavaScript.

Jeśli nie używasz własnej metody przesyłania formularza do wysyłania informacji na serwer (a zamiast tego używasz javascript), możesz użyć atrybutu name, aby dołączyć dodatkowe informacje do danych wejściowych - raczej jak powiązanie ich z ukrytą wartością wejściową, ale wygląda ładniej, ponieważ jest włączony do wejścia.

Ten bit nadal działa w Firefoksie, ale przypuszczam, że w przyszłości może nie zostać udostępniony.

Możesz mieć wiele pól wejściowych o tej samej wartości nazwy, o ile nie planujesz przesłać w staromodny sposób.

Na podstawie osobistych doświadczeń i zgodnie z opisem W3 Schools dla atrybutów:

ID jest atrybutem globalnym i dotyczy praktycznie wszystkich elementów HTML. Służy do jednoznacznej identyfikacji elementów na stronie internetowej, a do jego wartości można uzyskać dostęp głównie z poziomu interfejsu użytkownika (zwykle przez JavaScript lub jQuery).

nazwa jest atrybutem przydatnym dla określonych elementów (takich jak elementy formularza itp.) w HTML. Jego wartość jest najczęściej wysyłana do zaplecza w celu przetworzenia.

https://www.w3schools.com/tags/ref_attributes.asp

Poniżej znajduje się interesujące użycie atrybutu id. Jest on używany w znaczniku i służy do identyfikacji formularza dla elementów poza granicami, dzięki czemu zostaną one dołączone do innych pól w formularzu.

 <form action="action_page.php" id="form1">
 First name: <input type="text" name="fname"><br>
 <input type="submit" value="Submit">
 </form>

 <p>The "Last name" field below is outside the form element, but still part of the form.</p>
 Last name: <input type="text" name="lname" form="form1">

Id: 1) Służy do identyfikacji elementu HTML za pomocą modelu obiektowego dokumentu (poprzez Javascript lub stylizowany za pomocą CSS). 2) Oczekuje się, że identyfikator będzie unikalny na stronie.

Nazwa odpowiada elementowi formularza i identyfikuje to, co jest wysyłane z powrotem na serwer. Przykład:

<form action="action_page.php" id="Myform">
 First name: <input type="text" name="FirstName"><br>
 <input type="submit" value="Submit">
 </form>

 <p>The "Last name" field below is outside the form element, but still part of the form.</p>
 Last name: <input type="text" name="LastName" form="Myform">

Identyfikator służy do jednoznacznej identyfikacji elementu.

Nazwa jest używana w formularzach. Chociaż prześlesz formularz, jeśli nie podasz żadnego imienia, nic nie zostanie przesłane. Dlatego elementy formularza wymagają nazwy, aby można je było zidentyfikować za pomocą metod takich jak „get or push”.

I wyjdą tylko te z atrybutem nazwy.

idDa element id, więc raz piszesz prawdziwy kod, (jak JavaScript) można użyć identyfikatora czytać elementy. To nametylko nazwa, więc użytkownik może zobaczyć nazwę elementu, tak myślę.

Przykład:

<h1 id="heading">text</h1>
<script>
  document.getElementById("heading"); //Reads the element that has the id "heading".
</script>

//You can also use something like this:
document.getElementById("heading").value; //Reads the value of the selected element.

Czy to jest pomocne? Daj mi znać, jeśli są jakieś problemy.

Nie ma żadnej dosłownej różnicy między identyfikatorem a nazwą.

nazwa jest identyfikatorem i jest używana w żądaniu HTTP wysyłanym przez przeglądarkę do serwera jako nazwa zmiennej powiązana z danymi zawartymi w atrybucie wartości elementu.

Z drugiej strony identyfikator jest unikalnym identyfikatorem przeglądarki, strony klienta i JavaScript, dlatego formularz potrzebuje identyfikatora, a jego elementy wymagają nazwy.

id jest bardziej konkretnie używany w dodawaniu atrybutów do unikalnych elementów. W metodach DOM identyfikator jest używany w JavaScript do odniesienia do określonego elementu, na którym ma się odbywać akcja.

Na przykład:

<html>
<body>

<h1 id="demo"></h1>

<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>
</body>
</html>

To samo można osiągnąć za pomocą atrybutu name, ale preferuje się używanie id w formie i nazwie dla małych elementów formularza, takich jak tag wejściowy lub tag select.