Qual è la differenza tra gli attributi ide name? Entrambi sembrano servire allo stesso scopo di fornire un identificatore.

Vorrei sapere (in particolare per quanto riguarda i moduli HTML) se utilizzare entrambi è necessario o incoraggiato per qualsiasi motivo.

L' nameattributo viene utilizzato quando si inviano dati in un modulo di invio. Controlli diversi rispondono in modo diverso. Ad esempio, potresti avere diversi pulsanti di opzione con idattributi diversi , ma uguali name. Una volta inviato, c'è solo un valore nella risposta: il pulsante di opzione selezionato.

Certo, c'è di più, ma ti farà sicuramente pensare nella giusta direzione.

Utilizzare gli nameattributi per i controlli del modulo (come <input>e <select>), poiché si tratta dell'identificatore utilizzato nella chiamata POSTo GETche si verifica all'invio del modulo.

Utilizzare gli idattributi ogni volta che è necessario indirizzare un determinato elemento HTML con CSS, JavaScript o un identificatore di frammento . È anche possibile cercare elementi per nome, ma è più semplice e affidabile cercarli per ID.

Ecco un breve riassunto:

• idviene utilizzato per identificare l'elemento HTML attraverso il Document Object Model (tramite JavaScript o in stile CSS). iddovrebbe essere unico all'interno della pagina.

• namecorrisponde all'elemento del modulo e identifica ciò che viene registrato nel server .

Vedi questo http://mindprod.com/jgloss/htmlforms.html#IDVSNAME

Qual è la differenza? La risposta breve è, usa entrambi e non preoccuparti. Ma se vuoi capire questa sciocchezza, ecco il magro:

id = è per l'uso come un obiettivo come questo: <some-element id="XXX"></some-element>per i link come questo: <a href="#XXX".

name = viene anche utilizzato per etichettare i campi nel messaggio inviato a un server con un HTTP (HyperText Transfer Protocol) GET o POST quando si preme invio in un modulo.

id = etichetta i campi per l'utilizzo da parte di JavaScript e Java DOM (Document Object Model). I nomi in name = devono essere univoci all'interno di un modulo. I nomi in id = devono essere univoci nell'intero documento.

A volte i nomi name = e id = differiranno, perché il server si aspetta lo stesso nome da varie forme nello stesso documento o da vari pulsanti di opzione nella stessa forma dell'esempio sopra. L'id = deve essere unico; il nome = non deve essere.

JavaScript aveva bisogno di nomi univoci, ma c'erano già troppi documenti qui senza univoco name = names, quindi le persone W3 hanno inventato il tag id che doveva essere univoco. Sfortunatamente i browser più vecchi non lo capivano. Quindi hai bisogno di entrambi gli schemi di denominazione nei tuoi moduli.

NOTA: l'attributo "nome" per alcuni tag come <a>non è supportato in HTML5.

Il modo in cui ci penso e lo uso è semplice:

id è usato per CSS e JavaScript / jQuery (deve essere univoco in una pagina)

Il nome viene utilizzato per la gestione dei moduli in PHP quando un modulo viene inviato tramite HTML (deve essere univoco in un modulo - in una certa misura, vedere il commento di Paul di seguito)

Tag ID: utilizzato dai CSS, definisce un'istanza univoca di div, span o altri elementi. Appare all'interno del modello DOM Javascript, permettendoti di accedervi con varie chiamate di funzione.

Etichetta nome per i campi - Questo è univoco per modulo - a meno che non si stia eseguendo un array che si desidera passare all'elaborazione PHP / lato server. Puoi accedervi tramite Javascript per nome, ma penso che non appaia come un nodo nel DOM o potrebbero essere applicate alcune restrizioni (non puoi usare .innerHTML, ad esempio, se ricordo bene).

Generalmente, si presume che il nome sia sempre sostituito da id . Questo è vero, in una certa misura, ma non per i campi dei moduli e i nomi dei frame , praticamente parlando. Ad esempio, con gli elementi del modulo l' nameattributo viene utilizzato per determinare le coppie nome-valore da inviare a un programma sul lato server e non deve essere eliminato. Browsers do not use id in that manner. Per essere al sicuro, è possibile utilizzare gli attributi name e id sugli elementi del modulo. Quindi, scriveremo quanto segue:

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

Per garantire la compatibilità, avere una corrispondenza dei valori di nome e attributo id quando entrambi sono definiti è una buona idea. Tuttavia, fai attenzione: alcuni tag, in particolare i pulsanti di opzione, devono avere valori nominali non unici, ma richiedono valori ID univoci. Ancora una volta, questo dovrebbe fare riferimento al fatto che id non è semplicemente un sostituto del nome; hanno uno scopo diverso. Inoltre, non scartare l'approccio vecchio stile, uno sguardo approfondito alle librerie moderne mostra tale stile di sintassi usato a volte per prestazioni e facilità. Il tuo obiettivo dovrebbe essere sempre a favore della compatibilità.

Ora nella maggior parte degli elementi, l'attributo name è stato deprecato a favore dell'attributo id più diffuso. Tuttavia, in alcuni casi, in particolare formare campi ( <button>, <input>, <select>e <textarea>), la vita di attributo nome sul perché continua ad essere richiesto per impostare la coppia nome-valore per la forma di presentazione. Inoltre, scopriamo che alcuni elementi, in particolare frame e collegamenti, possono continuare a utilizzare l'attributo name perché è spesso utile per recuperare questi elementi per nome.

Esiste una chiara distinzione tra id e nome. Molto spesso quando il nome continua, possiamo impostare i valori allo stesso modo. Tuttavia, id deve essere univoco e il nome in alcuni casi non dovrebbe — pensare ai pulsanti di opzione. Purtroppo, l'unicità dei valori ID, sebbene catturata dalla convalida del markup, non è coerente come dovrebbe essere. L'implementazione CSS nei browser disegnerà oggetti che condividono un valore ID; pertanto, potremmo non rilevare errori di markup o di stile che potrebbero influire sul nostro JavaScript fino al runtime.

Questo è tratto dal libro JavaScript- The Complete Reference by Thomas-Powell

nameè obsoleto per le destinazioni dei collegamenti e non è valido in HTML5. Non funziona più almeno nell'ultimo Firefox (v13). Cambia <a name="hello">in<a id="hello">

Il target non deve essere un <a>tag, può essere <p id="hello"> o <h2 id="hello">ecc. Che è spesso un codice più pulito.

Come altri post dicono chiaramente, nameviene ancora utilizzato (necessario) nei moduli. È ancora usato anche nei tag 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>

Questo link ha le risposte alla stessa domanda di base, ma fondamentalmente id viene utilizzato per l'identificazione degli script e il nome è per il lato server.

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

name Vs id

nome

• Nome dell'elemento Ad esempio utilizzato dal server per identificare i campi negli invii di moduli.
• Gli elementi di supporto sono <button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param>
• Il nome non deve essere univoco.

id

• Spesso utilizzato con i CSS per definire uno stile specifico. Il valore di questo attributo deve essere unico.
• Id è attributi globali , possono essere utilizzati su tutti gli elementi, anche se gli attributi potrebbero non avere alcun effetto su alcuni elementi.
• Deve essere unico in tutto il documento.
• Il valore di questo attributo non deve contenere spazi bianchi, in contrasto con l'attributo class, che consente valori separati da spazi.
• Utilizzo di caratteri tranne lettere e cifre ASCII, '_', '-' e '.' può causare problemi di compatibilità, poiché non erano consentiti in HTML 4. Sebbene questa limitazione sia stata eliminata in HTML 5, un ID dovrebbe iniziare con una lettera per la compatibilità.

L'ID di un elemento di input del modulo non ha nulla a che fare con i dati contenuti nell'elemento. Gli ID servono per collegare l'elemento con JavaScript e CSS. L'attributo name, tuttavia, viene utilizzato nella richiesta HTTP inviata dal browser al server come nome variabile associato ai dati contenuti nell'attributo value.

Per esempio:

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

Quando il modulo viene inviato, i dati del modulo verranno inclusi nell'intestazione HTTP in questo modo:

Se aggiungi un attributo ID, non cambierà nulla nell'intestazione HTTP. Semplifica l'aggancio con CSS e JavaScript.

Se non stai utilizzando il metodo di invio del modulo per inviare informazioni a un server (e invece lo stai utilizzando tramite JavaScript) puoi utilizzare l'attributo name per allegare informazioni aggiuntive a un input, piuttosto come associarlo a un valore di input nascosto, ma sembra più ordinato perché è incorporato nell'input.

Questo bit funziona ancora attualmente in Firefox, anche se suppongo che in futuro potrebbe non essere consentito.

Puoi avere più campi di input con lo stesso valore, purché non preveda di inviare alla vecchia maniera.

Sulla base delle esperienze personali e secondo la descrizione delle Scuole W3 per gli attributi:

ID è un attributo globale e si applica praticamente a tutti gli elementi in HTML. Viene utilizzato per identificare in modo univoco gli elementi nella pagina Web e il suo valore è principalmente accessibile dal frontend (in genere tramite JavaScript o jQuery).

name è un attributo utile per elementi specifici (come elementi del modulo, ecc.) in HTML. Il suo valore viene principalmente inviato al back-end per l'elaborazione.

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

Di seguito è riportato un uso interessante dell'attributo id. Viene utilizzato all'interno del tag e utilizzato per identificare il modulo per gli elementi al di fuori dei confini in modo che vengano inclusi con gli altri campi all'interno del modulo.

 <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) Viene utilizzato per identificare l'elemento HTML attraverso il Document Object Model (tramite Javascript o in stile CSS). 2) ID dovrebbe essere unico all'interno della pagina.

Il nome corrisponde all'elemento del modulo e identifica ciò che viene registrato nel server. Esempio :

<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">

ID viene utilizzato per identificare in modo univoco un elemento.

Il nome viene utilizzato nei moduli. Anche se si invia un modulo, se non si specifica alcun nome, non verrà inviato nulla. Quindi gli elementi del modulo hanno bisogno di un nome per essere identificati da metodi come "get or push".

E quelli solo con l'attributo name usciranno.

Il iddarà un elemento di un id, così una volta si scrive il codice vero e proprio, (come JavaScript) è possibile utilizzare l'ID per leggere gli elementi. Il nameè solo un nome così l'utente può vedere il nome dell'elemento, immagino.

Esempio:

<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.

È utile? Fammi sapere se ci sono dei problemi.

Non esiste alcuna differenza letterale tra un ID e un nome.

name è identificativo e viene utilizzato nella richiesta http inviata dal browser al server come nome variabile associato ai dati contenuti nell'attributo value dell'elemento.

D'altra parte, l'id è un identificatore univoco per browser, lato client e JavaScript, quindi il modulo ha bisogno di un id mentre i suoi elementi hanno bisogno di un nome.

id viene utilizzato in modo più specifico per aggiungere attributi a elementi univoci. Nei metodi DOM, Id viene utilizzato in Javascript per fare riferimento all'elemento specifico su cui si desidera che la tua azione abbia luogo.

Per esempio:

<html>
<body>

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

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

Lo stesso può essere ottenuto con l'attributo name, ma è preferibile utilizzare id nel modulo e nel nome per elementi del modulo di piccole dimensioni come il tag di input o il tag select.