Dziś mam dla Was kilka ciekawych atrybutów HTML. Warto je znać, aby nie rozwiązywać prostych problemów za pomocą Javascriptu.
download
Za pomocą tego atrybutu mówisz przeglądarce, że ma ściągnąć dany zasób, zamiast go otwierać. Wykorzystywany jest razem z tagiem <a>
.
<a href="/img001.jpg" download>
Możemy też wskazać nową nazwę dla ściąganego pliku.
<a href="/img001.jpg" download="obrazek dla Ciebie">
Brak wsparcia na IE, Safari oraz Opera Mini. Póki co…
contenteditable
Atrybut oznacza, że element może być edytowalny przez użytkownika w ten sam sposób, jak element <input>
.
Dopuszczalne wartości atrybutu:
contenteditable
,contenteditable=""
,contenteditable=”true”
contenteditable=”false”
Atrybut jest najczęściej dopisywany do elementów div
oraz label
.
<div contenteditable="">Ten tekst możesz edytować!</div>
Brak wsparcia na Opera Mini.
spellcheck
Atrybut wskazuje, aby wprowadzany przez użytkownika tekst miał sprawdzaną pisownię i gramatykę.
Dopuszczalne wartości atrybutu:
spellcheck
,spellcheck=""
,spellcheck=”true”
spellcheck=”false”
Atrybut może być dopisany do takich elementów jak: input
typu tekstowego, textarea
, elementy edytowalne za pomocą atrybutu contenteditable
.
<textarea spellcheck="true">Ten tekst będzie miał sprawdzaną pisownię!</textarea>
Uwaga na wsparcie, które jest częściowe na Safari i wielu mobilnych przeglądarkach.
autocomplete
Atrybut, dzięki któremu możemy sterować automatycznym uzupełnianiem wpisywanego tekstu.
Jego dopuszczalne wartości to np. „on” albo „off”, które odpowiednio włączają albo wyłączają automatyczne podpowiadanie wprowadzanych danych. Ten atrybut można też uzupełnić wartością wskazującą na rodzaj danych, które powinny zostać wpisane przez użytkownika. Na przykład – mówimy przeglądarce, aby w jednym polu formularza podpowiadała zapamiętane telefony, a w drugim adresy email. Listę dostępnych opcji oraz zasady ich użycia znajdziecie TUTAJ.
Możemy go dopisać do takich elementów jak: form
, input
, textarea
, elementy edytowalne za pomocą atrybutu contenteditable
. Jest ignorowany, kiedy typ elementu należy do grupy: hidden, password,
checkbox,
radio,
file
lub jest przyciskiem. Szczegóły użycia tego atrybutu poznasz TUTAJ.
<input autocomplete="off"/>
Uwaga na wsparcie, które niestety jest tylko częściowe na większości przeglądarek.
Znaliście te atrybuty? Korzystacie z nich podczas pracy? Chętnie poczytam o tym w komentarzach!