Login
Accedi

Galleria mappe mentale Mappa mentale di riepilogo del riepilogo delle conoscenze relative a HTML5

Mappa mentale di riepilogo del riepilogo delle conoscenze relative a HTML5

Cos'è HTML5? Come studiare? HTML5 è un metodo di descrizione del linguaggio per strutturare i contenuti web. HTML5 è lo standard di prossima generazione di Internet e un metodo linguistico per costruire e presentare contenuti Internet. È considerata una delle tecnologie principali di Internet. HTML è stato creato nel 1990 e HTML4 è diventato uno standard Internet nel 1997 ed è ampiamente utilizzato nello sviluppo di applicazioni Internet. La seguente mappa riassume le conoscenze relative a HTML5 come riferimento e studio.

Modificato alle 2018-12-19 12:05:18

WSCoUtCI

Lavori recenti Visualizza più lavori>>

Mappa mentale di riepilogo del riepilogo delle conoscenze relative a HTML5

WSCoUtCI

Lavori recenti Visualizza più lavori>>

Consigliato per te
Profilo

Tag di base HTML
- 7
WSCoUtCI
La struttura di base dell'HTML
- 8
WSCoUtCI
Progettazione e produzione web HTML5 CSS3
- 5
WSCoUtCI
riepilogo html
- 8
WSCoUtCI
Mappa mentale elementare in HTML
- 7
WSCoUtCI
HTML
- 6
WSCoUtCI
Mappa mentale sul web
- 9
WSCoUtCI

HTML5

<body>Contenuto dell'URL

proprietà del corpo:

bgcolor: colore di sfondo Sfondo: immagine di sfondo Testo: colore del carattere onload: chiamato durante il caricamento

linea orizzontale

<hr>

Operazioni sui caratteri

Carattere grassetto

<b>

carattere corsivo

<i>

Sottolineare

<u>

barrato

<canc>

font

<carattere>: Colore: colore del carattere Dimensioni: dimensione del carattere da 1 a 7

<mark>Evidenzia</mark>

etichetta del titolo

<h1>~<h6> Rendi il carattere in grassetto, più grande e su una riga separata

tag di paragrafo

<p> Separare tra i paragrafi

nuova linea

<br>

spazio

Collegamento ipertestuale

collegamento ordinario

<a href="indirizzo">nome del collegamento</a>

collegamento di ancoraggio

Per prima cosa definisci il tag della posizione: <a name="ding"></a> Quindi utilizza un collegamento ipertestuale per passare a una posizione predefinita: <a href="#ding">Torna all'inizio</a>

connessione funzionale

Finestra pop-up QQ: quella che viene chiamata è l'interfaccia di chat remota di Tencent <a href="tencent://message/?uin=10001&Menu=yes"> <img border="0" src="http://wpa.qq.com/pa?p=1:615050000:10"/></a>

Tag immagine

elenco

Lista ordinata:

<ol tipo="valore"> <li>Banana</li> <li>Patate</li> <li>Yali</li> </ol>

Lista non ordinata:

<ul type="valore"> <li>Pechino</li> <li>Shanghai</li> <li>Guangzhou</li> </ul>

Creazione rapida

ul>li*4 tasto tab

foglio

proprietà della tabella

border: bordo della tabella, il valore è di tipo int, maggiore è il valore, più spessa è la linea, 0 significa nessuno bordercolor: colore della cornice della tabella spaziatura celle: la distanza tra le celle larghezza: larghezza della tabella, pixel o percentuali altezza: altezza della tabella, pixel o percentuale bgcolor: colore di sfondo della tabella o della cella (applicabile a table, tr, td) sfondo: immagine di sfondo

Creazione rapida

tabella>tr*2>td*3

tr rappresenta la riga td rappresenta la colonna

Unire le celle

colspan: unisci orizzontalmente con parallelo (direzione orizzontale/sinistra-destra) rowspan: unisci le righe (direzione verticale/direzione su e giù) unisci verticalmente Nota: unire significa che più elementi diventano uno solo, quindi eventuali eccedenze devono essere eliminate!

modulo

attributi del modulo:

- azione: la destinazione dell'invio del modulo - metodo: il metodo di invio del modulo ottiene testo semplice (predefinito)/testo cifrato - enctype: metodo di codifica (ci sono elementi speciali nel modulo: utilizzato solo durante il caricamento di immagini) onsubmit: invio dell'evento

ingresso

<input type="x" name="y" placeholder="" disabilitato="disabilitato"> tipo: tipo nome: nome della casella di input segnaposto; casella di input rapido disabile: disabile

Il valore di tipo: testo: casella di immissione testo (valore predefinito) password: casella di immissione della password casella di controllo: casella di controllo/casella a selezione multipla <-selezionato seleziona l'elemento selezionato radio: pulsante di opzione invia: pulsante Invia (puoi utilizzare il valore per sovrascrivere il nome predefinito del pulsante) reset: pulsante di reset (è possibile utilizzare value per sovrascrivere il nome del pulsante predefinito) pulsante: pulsante -In modulo: equivalente al pulsante di invio - Fuori dal modulo: pulsante normale colore: tavolozza dei colori data: calendario mese: calendario mensile calendario settimanale della settimana numero: campo numerico -min valore minimo -valore massimo massimo salti di passo per multipli dell'input gamma: diapositiva casella di ricerca

<seleziona> <option>Menu a discesa</option> ... </seleziona>

barra di scorrimento

Casella di input Lenovo

Sii coerente

Area contenuti espandibile

telaio

Riferimenti ad altre pagine (con collegamenti ipertestuali)

<a href="Apri pagina o immagine" target="xy">Capitolo 1</a> <br /><br /> <a href="Apri pagina o immagine" target="xy">Capitolo 2</a> <br /><br /> <a href="Apri pagina o immagine" target="xy">Capitolo 3</a> <br /><br /> <nome iframe="xy" larghezza="400px" altezza="300px"></iframe>

target: l'obiettivo dell'apertura della pagina web è la posizione xy

etichetta multimediale

<video>video

<audio>Musica

Mostra i controlli di riproduzione

controlli

Riproduzione automatica

riproduzione automatica

ciclo automatico

ciclo continuo

sentiero

src

tag struttura div

Deriva molti elementi secondari div basati su div e possono essere utilizzati come div Ogni elemento figlio ha il proprio nome per completare la descrizione "semantica" del div. Semantizzazione: simile a "conoscere il significato dopo aver visto il nome" nella specifica della denominazione delle variabili Java

area contenuto nella pagina web

articolo

Contenuti esterni all'articolo

Combinazione di contenuto e titolo

<nav>

navigazione

Immagini e testi

Intestazione della pagina web

<piè di pagina>

in fondo alla pagina

galleggiante trasparente: entrambi i lati

chiaro: entrambi;

<stile>stile CSS

Utilizza tre metodi:

stili in linea

scritto all'interno del tag di apertura

stile interno

Scritto tra </head><body>

foglio di stile esterno

Crea un file .css e scrivici dentro

Definizione:<link href="css/01.css" rel="stylesheet"/>

priorità css

Il principio di prossimità

Selettore

selettore di elementi

Formato:h2{}

Utilizzare il nome del tag come destinazione della modifica

classe di selezione della classe

Formato: nome .class{}

Filtrare ulteriormente il selettore dell'elemento

ID selettore ID

Formato: #id nome{}

Fare un ulteriore passo avanti nei selettori di classe

gruppo selezionatore

Formato:h1,h2,h3{}

selettore derivato

Selettore discendente (seleziona tutto)

Formato:div p{}

Selettore discendente(selettore)

Formato:div>p{}

Selettore di pseudoclasse

Non cliccato

Formato: a:link{}

Dopo aver cliccato

Formato:a:visitato{}

passa il mouse

Formato: a:al passaggio del mouse{}

Fare clic e tenere premuto

Formato:a:attivo{}

Le quattro pseudo-classi devono essere in un certo ordine, altrimenti non saranno valide lvha

sfondo

colore di sfondo

colore di sfondo: rosso;

Immagine di sfondo

immagine-di-sfondo:url(img/1.jpg);

piastrellatura dello sfondo

Per impostazione predefinita, l'immagine di sfondo è "affiancata" sugli assi xey. Utilizza la ripetizione in background per controllare il funzionamento dell'affiancamento:

ripetizione: valore predefinito, affiancamento nelle direzioni x e y

ripeti-x: piastrellatura nella direzione x

ripetizione-y: piastrellatura nella direzione y

no-repeat: nessuna piastrellatura

padella di fondo

scorrimento dello sfondo

background-attachment: scorrimento; scorrimento dello sfondo (valore predefinito)

background-attachment: risolto; lo sfondo non si muove

dimensione dello sfondo

contenere: zoom alla dimensione dell'area di sfondo (l'immagine di sfondo viene visualizzata completamente) copertina: ridimensiona per coprire completamente l'area dello sfondo (non lasciare spazi vuoti)

posizione dello sfondo

sfondo-origine:

scatola di confine;

casella di riempimento: (impostazione predefinita)

casella del contenuto:

ritaglio dello sfondo

clip di sfondo:

scatola di confine;

casella di riempimento: (impostazione predefinita)

casella del contenuto:

Tagliato su quattro lati

telaio

Quattro lati, impostati contemporaneamente: bordo: 3px rosso pieno;

Gestione dell'overflow del testo

auto: adattivo, se supera il limite verranno aggiunte barre di scorrimento, altrimenti non verranno aggiunte barre di scorrimento.

nascosto: nascosto se superato

Colore RGB

http://tool.oschina.net/commons?type=3

modello a scatola

margine margine

in cima

imbottitura imbottitura

sinistrasinistra

stile del testo

font

font-family:"Microsoft Yahei";

dimensione del font

dimensione carattere: 50px;

colore del carattere

colore:arancione;

Allineamento del testo (sinistra, centro, destra)

allineamento testo: centro;

Carattere grassetto

peso carattere: grassetto;

Linea centrale (elimina riga)

decorazione del testo: riga passante;

Sopralineato

decorazione del testo: sopralineato;

colore di sfondo

fondo: marrone;

Altezza (altezza della casa)

altezza: 150px;

Altezza della riga del testo (altezza umana)

altezza della linea: 150px;

rientranza

rientro del testo: 30px;

stile tavolo

Unisci i bordi delle celle

collasso del confine: collasso;

stile elenco

rimuovere

tipo stile elenco: nessuno;

numero

tipo stile elenco: decimale;

romano minuscolo

tipo-stile-elenco: lower-roman;

Capitale romana

tipo-stile-elenco: upper-roman;

punti neri

tipo di stile elenco: disco;

bloccare

tipo di stile elenco: quadrato;

cerchio

tipo di stile elenco: cerchio;

Sostituisci i tag degli elementi dell'elenco con le immagini

immagine-stile-elenco: url(img/1.png);

Passa all'orientamento orizzontale tramite il posizionamento mobile

Stile topo

cursore:

predefinito: puntatore

puntatore: dito

mirino: croce

testo: concentrati

aspetta aspetta

stile di posizionamento

Classificazione degli elementi

Tutti i tag degli elementi hanno la propria classificazione, livello di blocco o livello di riga

Elementi a livello di blocco:

h1~h6, p, div, ecc...

Orientamento verticale dall'alto verso il basso (a capo automatico): larghezza e altezza possono essere modificate

elementi in linea

a,b,intervallo ecc...

Da sinistra a destra, orientamento orizzontale (nessuna riga a capo): non è possibile modificare larghezza e altezza

Elementi del blocco in linea:

input, img, ecc...

Da sinistra a destra, direzione orizzontale (a capo automatico): larghezza e altezza possono essere modificate

Targeting predefinito

Visualizzazione degli elementi a livello di blocco

blocco di visualizzazione;

Visualizzazione predefinita

Visualizzazione degli elementi in linea

visualizzazione: in linea;

Impossibile modificare larghezza e altezza

Visualizzazione degli elementi del blocco in linea

display: blocco in linea;

Può cambiare larghezza e altezza

posizionamento flottante

Un elemento flottato può essere spostato a sinistra o a destra finché il suo bordo esterno non tocca l'elemento genitore pixel o il bordo di un'altra casella flottata Gli elementi flottati si trovano ancora all'interno dell'elemento genitore

galleggia a sinistra

galleggiante: sinistra

galleggia a destra

galleggiante: giusto

posizionamento relativo

La distanza tra questo elemento e gli elementi adiacenti

posizione: relativa

posizionamento assoluto

La distanza tra questo elemento e l'elemento nonno

posizione: assoluta

Posizionamento fisso

Mantieni invariata la posizione dell'elemento

posizione: fissa;

Asse z (visualizzazione sovrapposta)

Maggiore è il valore, più vicino al viso (più vicino al viso)

z-index: valore numerico

Testo nascosto

visualizzazione:nessuno;

Testo nascosto

Funzione

Rimuovi la sottolineatura dal collegamento ipertestuale

decorazione del testo: nessuna;

<stile>stile css3

angoli arrotondati

border-radius:50%;/*bordo angoli arrotondati 50%*/(cerchio)

raggio bordo: px in alto a sinistra, px in alto a destra, px in basso a destra, px in basso a sinistra;

border-radius: in alto a sinistra (in alto a destra) px in alto a destra (in basso a sinistra) px;

ombra

ombra della scatola

box-ombra: offset orizzontale px offset verticale px dimensione sfocatura px dimensione ombra px colore ombra;

ombra del testo

text-shadow: il colore dell'ombra, la direzione orizzontale px, la direzione verticale px, la dimensione della sfocatura px;

Pendenza

gradiente lineare

background:linear-gradient([alla direzione] lista colori);

gradiente radiale

sfondo: gradiente radiale (lista colori);

La lista dei colori può avere N numeri

animazione

animazione di transizione

Puoi controllare solo l'inizio e la fine, ma non il processo intermedio.

transizione: attributo css della transizione o simulazione dell'animazione, tempo utilizzato per completare la transizione, funzione di transizione [tempo di ritardo dell'inizio della transizione];

Non tutti gli attributi supportano la transizione, i CSS3 sviluppano solo alcuni attributi

Funzione di transizione:

sollievo

Predefinito.da veloce a lento

lineare

Velocità uniforme

facilità

accelerare

facilità

rallentare

facilità di entrata e uscita

Prima accelera e poi rallenta

animazione

Da uno stato all'altro, ogni momento del processo può essere controllato.

Definisci l'animazione:

@nome animazione fotogrammi chiave{ inizia da{colore, forma, distanza...} a{colore, forma, distanza...} fine }

@nome animazione fotogrammi chiave{ 0%{colore, forma, distanza...} ... 100%{colore, forma, distanza...} }

Associa l'animazione

selettore di elementi { animazione: nome dell'animazione, tempo di esecuzione, funzione di transizione, numero di esecuzioni [esecuzione alternata di andata e ritorno]; }

infinito

Tempi di esecuzione wireless

JS è una tecnologia di programmazione web utilizzata per aggiungere comportamento interattivo

js è un linguaggio interpretato (di scripting). Il browser interpreta ed esegue il codice senza pre-elaborazione. Compilare.

Usa tre modi

All'interno del settore

<input type="button" value="Fratello, cliccami" onclick="alert('嘤嘤嘤')";

al clic

Evento vincolante

mettere in guardia()

Pop-up

interno

<copione> alert("ciao mondo!") </script>

esterno

Crea un file con il suffisso ".js"

Definizione:<script src="01.js"></script>

Priorità: chi è in cima? Chi dovrebbe essere giustiziato per primo?

variabile

Poiché JavaScript è un linguaggio tipizzato debolmente, quando si definiscono le variabili, tutti i tipi di dati vengono dichiarati utilizzando var;

Tipo numerico: numero

Stringa: la stringa utilizza virgolette doppie o virgolette singole

Tipo booleano: true=1 |. false=0 (convertito in 1 e 0 durante l'operazione)

conversione automatica del tipo

numero stringa = stringa

Numero booleano = numero

stringa booleana = stringa

booleano booleano = numero

funzione di conversione

Converti qualsiasi tipo in stringa

x.toSring();

Converti stringa in numero intero

analizzareInt(x)

Converti stringa in decimale

analizzareFloat(x)

Interrogare (giudicare) il tipo corrente di valore

tipodi(x)

Impossibile convertire i rendimenti NaN

Casella di output della richiesta

richiesta()

Casella di immissione richiesta

mettere in guardia()

Pop-up

console.info()

uscita della console

documento.write()

Visualizza il contenuto della pagina

Operatore/Controllo del flusso

Operazioni aritmetiche

operazioni relazionali

Rigorosamente uguali

===Stesso tipo e valore

non strettamente uguali

!==

operazione logica

aritmetica ternaria

Struttura ad anello

Giudizio condizionale

Oggetti comuni

Corda

Crea oggetto stringa

var str="ciaomondo";

var str=new String("ciaomondo");

Metodi comunemente usati:

ArrayArray

Non importa quale tipo di dati, è Array

Tre modi per inizializzare un array

var arr1 = nuovo Array(); arr1[0] = 10; arr1[1] = 20; arr1[2] = 30; console.info(arr1);

var arr2 = new Array(10,'a',true); console.info(arr2);

var arr3 = [5,'b',false]; console.info(arr3);

Matrice bidimensionale

Gli elementi nell'array sono un array.

Metodi comunemente usati per gli array:

Matematica numerica

http://www.w3school.com.cn/jsref/jsref_obj_math.asp

Turno di matematica(x)

Arrotonda al numero intero

Piano matematico(x)

Arrotondamento

Matematica.casuale();

Restituisce un numero casuale compreso tra 0 ~ 1.

max(x,y) restituisce il valore più alto tra x e y. min(x,y) restituisce il valore più basso tra x e y.

Classe di incapsulamento dei numeri

dati var = 23,56789; alert(data.toFixed(2));//23.57

Converte un valore numerico in una stringa e conserva un certo numero di cifre dopo il punto decimale

DataData

Espressione regolare

Metodi comuni

RegExp.test(stringa)

Restituisce vero se la stringa stringa contiene testo che corrisponde a RegExp , altrimenti restituisce false

nullo e indefinito

nudo

C'è un oggetto, ma non ha valore

nullo

Nessun obiettivo

Funzione (come il metodo Java)

definizione della funzione

Definito dalla funzione parola chiave

Le regole di definizione dei nomi delle funzioni sono coerenti con gli identificatori e fanno distinzione tra maiuscole e minuscole.

È possibile utilizzare variabili, costanti o espressioni come argomenti per le chiamate di funzione

Il valore restituito deve utilizzare return

funzione nome della funzione (parametro) { corpo funzionale; restituire il valore restituito; }

funzione senza parametri

funzione abc(){ for(var i = 1;i<=5;i){ console.info(i); } }

funzione con parametri

funzione he(a,b){ avviso(a b); }

Per le funzioni con parametri, non aggiungere tipi di dati durante la definizione.

funzione con valore restituito

oggetto parametro argomenti

funzione he(a,b){ avviso(a b); console.info(argomenti.lunghezza); //Numero di parametri console.info( argomenti[0] ) ;//Il valore di b }

topics.length ottiene il numero di elenchi di parametri argomenti[pedice] ottiene i parametri in una determinata posizione

funzione anonima

Una funzione senza nome può essere eseguita solo questa volta (simile alla classe interna anonima di Java)

funzione globale

Sono tutti predefiniti e js li prepara per noi. Basta fare riferimento direttamente con il nome del metodo.

comune

analizzareInt() |. analizzareFloat()

isNaN() determina se contiene caratteri

eval(): utilizzato per convertire le operazioni in stringhe

codificaURI()

codifica

decodificaURI()

decodifica

Oggetto DOM

Gli elementi sono un meccanismo interno a JavaScript che converte tutti gli elementi di una pagina HTML in oggetti. Questo meccanismo è "DOM" Ogni documento è un oggetto documento.

Come trovare i nodi degli elementi:

Ottieni l'oggetto univoco tramite il valore id

document.getElementById(valore id)

Ottieni più oggetti corrispondenti tramite il valore dell'attributo name

document.getElementsByName( nome valore )

Ottieni più oggetti corrispondenti tramite i nomi dei tag

document.getElementsByTagName(nome tag)

Caso: verifica dell'accesso

Cassa: cambio colore intrecciato

Caso: seleziona tutti gli effetti

Modifica lo stile del nodo:

Formato: elemento object.style.css nome attributo="valore attributo";

Per esempio: nodo.style.color = "rosso"; node.style.fontSize = "10em"; Modifica più stili contemporaneamente: className = "nome classe";

Caso: attributi di classe

Nodo di ricerca gerarchica

Poiché c'è un nodo vuoto tra i tag div e p da analizzare, verrà visualizzato #text, che appartiene al nodo text. rimuovere gli spazi bianchi

Tipo di nodo:

selezionare l'operazione dell'elemento

oggetto elemento tabella tabella

Crea nodo

eliminare e sostituire

eliminare

sostituire

Oggetto del browser della distinta base

oggetto finestra finestra

avviso (messaggio rapido)

Finestra di dialogo Richiesta

confermare (messaggio di richiesta)

Se la finestra di dialogo restituisce il tipo booleano

prompt(messaggio richiesto,[contenuto])

finestra di dialogo di input

finestra.chiudi()

Chiudi la finestra del browser corrente

window.open (indirizzo della pagina Web aperta, nome della finestra, [parametri])

Apri una nuova finestra del browser

parametro:

timer da finestra

setIntervallo(1,2); 1: Azioni ripetute (funzioni) 2: Intervallo di tempo (millisecondi)

timer periodico

clearInterval(oggetto timer)

Interrompi le attività pianificate

setTimeout(1,2) 1. Funzione da eseguire 2, intervallo (millisecondi)

Timer una tantum, simile all'effetto ritardo

oggetto sullo schermo

larghezza.dello.schermo altezza.dello.schermo

Ottieni la risoluzione dello schermo

oggetti con tracce storiche

storia.go(num)

Ritorno al precedente

Se num è positivo significa andare avanti Se num è negativo significa tornare indietro

storia.indietro()

ritorna alla pagina precedente

oggetto posizione

location.href=La destinazione del salto di pagina

Salta la pagina del caso

eventoevento

eventi del mouse

evento clic del mouse

al clic

Evento doppio clic del mouse

ondblclick

evento al passaggio del mouse

al passaggio del mouse

evento di uscita del mouse

onmouseout

Eventi da tastiera

evento di pressione della tastiera

onkeydown

Evento di rilascio della tastiera

onkeyup

evento di stato

onfocus

concentrati

sfocato

perdere la concentrazione

onchange

Attivato dal cambiamento

Caso: Effetti a cascata provinciali e comunali

Il meccanismo predefinito per gli eventi

La sequenza scatenante degli eventi va dall'interno verso l'esterno, che è il meccanismo del ribollire.

Se due pulsanti cadono insieme, entrambi i clic verranno attivati per impostazione predefinita.

Annullare il meccanismo del gorgogliamento:

event.stopPropagation();

Scossa elettrica del mouse: coordinate xey

evento.chintX

evento.chintY

evento.destinazione.NodoNome

verificarsi bersaglio

Nozioni di base orientate agli oggetti

Tre modi per creare oggetti

utilizzare l'oggetto

Usa il costruttore

Usa valori letterali (oggetti JSNO)

Oggetto JSNO

Crea oggetto jsno

Crea l'array jsno

oggetto complesso json

Quadro JQuery

introduzione

1. jquery è sviluppato da js, quindi jquery stesso è javascript

Ambiente di sviluppo jquery-3.3.1.js jquery-3.3.1.min.js per l'ambiente di produzione

Semplice cambio di colore interlacciato

Selettore potente

selettore di base

selettore di tag

$("p")

selettore id

$("#er")

selettore di classe

$(".si")

Selettore 1, Selettore 2. . .

$("#er,.si")

selettore di livello

selettore discendente

$("#d2p")

p1 p2

selettore discendente

$("#d2>p")

fratelli vicini

$("#d2p")

successivop

tutti i fratelli dietro

$("#d2~p")

Tutte le p dopo

Selettore del filtro di base

primo elemento

$("p:primo")

ultimo elemento

$("p:ultimo")

Non contiene elementi in not (filtraggio)

$("p:non(.si)")

Elementi con pedici dispari

$("p:dispari")

Elementi con pedici pari

$("p:pari")

Elementi con pedici uguali

$("p:eq(2)")

elemento maggiore del pedice

$("p:gt(2)")

Elementi più piccoli del pedice

$("p:lt(2)")

Selettore del filtro dei contenuti

Contenuto della query fuzzy L'elemento content contiene tutti gli elementi p di is

$("p:contiene(è)")

Seleziona elementi con contenuto vuoto

$(:vuoto")

selettore di visibilità

(Secondi) Visualizza il testo nascosto dell'elemento p

$("p:nascosto").show(1000);

selettore di moduli

:input seleziona tutte le caselle di input :text seleziona tutte le caselle di testo : password seleziona tutte le caselle della password : la radio seleziona tutti i pulsanti radio : casella di controllo seleziona tutte le caselle di controllo :submit seleziona tutti i pulsanti di invio : reset seleziona tutti i pulsanti di reset : pulsante seleziona tutti i pulsanti : file seleziona tutti i campi del file : nascosto seleziona tutti i campi nascosti

selettore di attributi

Gli attributi iniziano a contenere xx

$("un[href^=xx]")

La fine dell'attributo contiene xx

$("a[href$=xx]")

L'attributo contiene xx

$("a[href*=xx]")

filtro del modulo

Seleziona tutti gli elementi disabilitati

:Disabilitato

Seleziona tutti gli elementi disponibili

:abilitato

Seleziona gli elementi selezionati

:controllato

Funzione attributo:

Ottenere

$("img").attr("titolo");

Ottieni il valore dell'attributo titolo di img

$("input").val();

Ottieni il valore della casella di input

$("div").testo();

Ottieni il contenuto di testo semplice all'interno del div

$("div").html();

Ottieni tutto il contenuto nel div (valore testo tag html)

impostare

$("img").attr("titolo","xxx");

Imposta il valore dell'attributo titolo di img

$("input").val("xxxx");

Imposta il valore della casella di input

$("div").testo("xxxx");

Imposta il contenuto di testo semplice all'interno del div

$("div").html("xxxx");

Imposta tutto il contenuto all'interno del div (valore testo tag html)

Rimuovere

$("img").removeAttr("titolo");

Rimuovi il valore dell'attributo titolo di img

funzione di stile

$("p").addClass("stile classe");

Aggiungi stili di classe agli elementi

$("p").removeClass("stile classe");

Rimuovi lo stile della classe dall'elemento

$("p").toggleClass("stile classe");

Cambia stile (sì->no, no->sì)

$("p").css("attributo css")

Ottieni il valore dell'attributo css dell'elemento p

$("p").css("proprietà","valore")

Imposta il valore dell'attributo css dell'elemento p

$("p").css({"larghezza": "150px",...});

Imposta i valori di più attributi CSS dell'elemento p (jsno)

$("div").larghezza()

Ottieni la larghezza dell'elemento

$("div").altezza()

Ottieni l'altezza dell'elemento

$("div").larghezza(valore)

Imposta la larghezza di un elemento

$("div").altezza(valore)

Imposta l'altezza di un elemento

La differenza tra h5 e h4

Dichiarazione di documentazione

Progettazione della codifica dei caratteri

Senza distinzione tra maiuscole e minuscole

attributo booleano

Citazioni omesse

tag di fine omesso