Scribd
Upload
3 views2 pages

cheatSheet2.0Final Searchable

The document is an HTML form that includes fields for username, password, and user role selection (Administrator or User). It also contains additional options with checkboxes, a dropdown menu, and file upload functionality. The form is designed to submit data via a GET method to a specified PHP script.

Uploaded by

fRan hOrvat
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views2 pages

cheatSheet2.0Final Searchable

The document is an HTML form that includes fields for username, password, and user role selection (Administrator or User). It also contains additional options with checkboxes, a dropdown menu, and file upload functionality. The form is designed to submit data via a GET method to a specified PHP script.

Uploaded by

fRan hOrvat
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Korisni¢ko ime: enter your username

<!DOCTYPE html> <form target="_self" action="/processForm.php" method="GET">


Lozinka:
<html lang="en"> <k-- target: self unutar istog, blank unutar novog >
Skriven input
<head> Uloga
<meta charset="UTF-8"> <label=Korisnicko ime: <input type="text" O Administrator
<meta name="viewport" name="username” value="enter your username” ® Korisnik
content="width=device-width, size="30"></label><br/>
initial-scale=1.0"> Dodatne opcije
<link rel="stylesheet" type="text/css" <label>Lozinka: <input type="password" [Jstakia
href="styles/main.css"> name="password" [JFelge

<script src="scripts/main.js"></script> maxlength="30" required></label><br/> Opcia2 +


</head> <label>Skriven input <input type="text" hidden readonly></label> mm / dd / yyyy
<body></body> Datoteka: Browse... No file selected.
</html> <fieldset> <!-- radio-button -> izbor jednog --> Inicijalan sadrzaj

<legend>Uloga</legend> Submit | | Odustani


<b>Bold <strong>text</strong></b> <label><input type="radio” name="role"
value="admin">Administrator</label><br/> Jednostavni:
<ixltalic <ems>text</ems></i>
* => sve
<ins>underlined<del>crossed texi</del></ins> <input type="radio" id="user" name="role" value="user" checked>
h1,li=>svih1ili
<time datetime= <label for="user">Korisnik</label>
<ffieldset> li.c1 => svili s klasom c1
"1969-07-20 20:17">20.srp '69., 20:17 </time>
Atributni:
<figure><img src="slika.jpg" height="300px"
li[id="z2"] => svi li s id=22
alt="Opis"> <fieldset> <!-- checkbox -> bilo koji broj -->
<figcaption>Tekst ispod slike</figcaption></figure> <legend>Dodatne opcije</legend>
<label><input type="checkbox" Kombinirani:
<ul style="list-style-type:square;">
<li>G</li> . G name="stakla" value="da" checked>Stakla</label><br/> div span => svi span unutar div
div > span => neposredna djeca span
<li style="list-style-type:circle;">K</li> °o K <label><input type="checkbox"
name="felge" value="da">Felge</label>
roditelja div
</ul>
</fieldset> div+span => prvi span nakon diva,
<ol type="1" start="2">
<!--1,A,a,l -> nacin numeriranja --> 2. Java <select name="padajuca_lista" size="1"> ista razina
<lisJava</li> 3.C <!-- multiple za selectanje vise > div~span => isto kao +, ali sve

<option value="opcija" selected=>Opcija</option>


elemente nakon diva iste razine
<li>C</li>
</ol> EC &" <option value="opcija">Opcija2</option>
</select><br/> Pseudoklasa:
&euro;&copy;&gt;&lt;&amp;&quot;
div:hover => na hover misa
&nbsp;(razmak) <input type="date" name="trip_start"><br/>
<dl> Naslovl <label>Datoteka: lifirst-child => li koji je prvo dijete
roditelja
<dt>Naslov1</dt><dd>Opis1</dd> Opisl <input type="file" name="datoteka"></label><br/>
input:required => svi required inputi
<dt>Naslov2</di><dd>Opis2</dd> Naslov2 <!-- mora biti POST u method -->
</dl> Opis2 <textarea name="tijelo" rows="10"
cols="50">Inicijalan sadrzaj</textarea><br/> Pseudoelementi:
<table>
<input type="submit" value="Submit"> p::before, p::after {content: "\"";} =>
<colgroup> <!-- uredivanje stila stupaca -->
<col> <!-- preskoci prvi stupac > <input type="reset" value="Odustani"> ubaci " prije i poslije paragrafa
</form> p:first-letter
<col span="2" style="background-color: cyan;">
p:first-line
<!-- uredi iduca dva --> <!--
greske kodiranja sadrzaja: p::selection => dio elementa koji je
</colgroup>
ponovljeno ime elementa, atribut disabled, atribut nije definiran
odabrao korisnik
<ir>
<th rowspan="2" style="transform: rotate(-90deg)"> application/x-www-form-urlencoded -> cust=Pero+Peri%C4 inline =>1000
Uzorci</th> text/plain -> za developere -> cust=Pero address=Ulica #d => 100
<td>al1</td> rT > .class, :pseudo-class, [attribute] => 10
<td>al2</td> £ a11]@12] } <TAG>, :pseudo-element => 1

<fir> 8 -flex-container { <body>, * => 0


<ir> pa’ 21 | display: flex; border: inherit => uzmi od roditelja
<td colspan="2">a21</td> flexcflow: column wrap; } border: initial => iskljuci sve, uzmi od
“rs /* nowrap (stisni sve elemente ako se smanji prostor) browsera
<Atable> wrap (kreni slagat elemente po redu odozgora prema dolje) border: unset => inherit ako ima
wrap-reverse(odozdo prema gore ih slazi po redu) matching value, initial inace

<a href="http://www.fer.hr/index. html">fer</a> Justity-contentifiex-start;


/* justify-content:flex-start(lijevo),flex-end(desno) ) neki css elementi:
<a href="#b2" litle="1. poglavlje">poglavlje</a>
<h3 id="b2">Skoci na ovo poglavnje</h3> center, space-betweeen.space-around,space-evenly po x-0si*/ font-family, font-weight:bold, font-size,

<hr /> <I horz crta-> aiign-tems: flex-start; font-style:italic, text-


/* align-items:flex-start(gore),flex-end(dolje)
center */ decoration :underline/none
<div class="grid-container"> /* align-content: space-around; text-align, text-indent, letter-spacing,
<code></code> <div class="grid-item">1</div> align-content: flex-start(gore),flex-end(dolje), line-height
<prestocan ispis</pre>
<div class="grid-item">2</div> center,space-between,space-around,space-evenly background-image: url(’./images/x.jpg’)
<kbd>keyboard el</kbd> skupi sve elemente i mice ih po y osi
<div class="grid-item spoji">\</div> background-repeat: no-repeat, repeat
<samp>sample output</samp:>
<div class="grid-item spoji ">/</div> box-sizing: border-box
.spoji{
Rok | smaniji vrijednost | </div> display: block/inline/inline-block
grid-column-start: 1; grid-column-end: 3;
<button onclick="decr()">-</button> padding, border, margin
grid-row-start: 2; grid-row-end: 3;
<input id="cnt" type="text" .grid-container{ margin:auto => centriranje
umns: 10fr 5fr: grid-area: 1/2/3/3 }
value="5" readonly/> grid-template-col max-width, width,vw,vh,vmin,vmax
function decr(){ justify-items: end position: relative/absolute/fixed
let cnt=document.getElbyid /* lijevo,centar,desno -> start,center,end */
cnt.value=Number(cnt.value)-1; align-items: end; Vazniji globalni atributi: id,class,
by Aux,Spike,Krampert /* gore,sredina,dolje -> start,center,end,stretch */} lang, title,style
var x = 123e-5; let y = "string"; Booelan setTimeout( () = console.log(3) , 3000 ); // nakon 3s Rok | utakmice |
const z = 'string’; (undef,null,NaN,0,"™) let promise = new Promise( (resolve, reject) => { btn.setAttribute('onclick', 'foo()’);
/"1"+'2'="12", Number(1)+Number(2)=3 false setTimeoul( () => { <template id="template">
letexp =2"3//2"3=8 Number( console.log("nakon 3 sekunde..."); <div class="container">
// strings \\ null false=0 if (false) { <p class="item1"></p>
let s = "he said: \"xd\""; undefined=NaN resolve("dobro izvrsen"); <img class="item2"></p>
let len = s.length; true=1) } else { </div>
let index = s.indexOf("xd"); // .lastindexOf) |, I___undef false reject("lose izvrsen"); </template>
let newString = s.slice(1,2); // [od,do),e null==undef true // moze i reject(new Error("lose izvrsen™)) } let template =
let numToSlring = (123).toString(); 2 document.querySelector("#template™);
let stringToNum = Number(numToString); 3000); let section =

function Hedstot vale?) { let mapa=new Map(); mise then( ope Coe elector
Clonetodelirel
console.log(x): mapa.set('mile’,'car’); func ’ " le. in: sec 'on.query ol
; mapa.get(mil) /undefined Tuncton(result) {console.log(result:}, (".item1").textContent = "aaa";
} I // ako resolve, result = "dobro izvrsen” seclion.querySelector
let f2 = function(x) {console.log(x);} mapa.has( mile’); function(error) {console.log(error);} "i " src=" ".
) mapa.delete("mile"); u ' ¢ ’ (".tem2").src = "x.png";
let f3 = (x) => console.log(x); m // ako reject, result = "lose izvrsen" document.body.appendChild(section);
arrays \\ apa.clear() ); let sections =
letarr =[1,2,3,5,6,1,7.8]; promise.catch( document.querySelectorAll(".container”);
let last = arr.pop(); // makne i returna zadnji function(error) {console.log(error);}// samo ako reject for (let section of sections)
arr.push(4); // append na kraj ) { section.remove(); } // brisanje svih
let first = arr.shift(); / makne i returna prvi promise.catch(
arr.unshift(5); // ubaci na pocetak function(error){console.log(error);}
arr.splice(1,2); // brise 2 elementa od indeksa 1 ).then(
let arr2 = [6, 7]; function(result){console.log("Resolve:"+result)},
let arr3 = arr.concat(arr); // spoji function(result){console.log("Reject:"+result)}
arrd = arr3.slice(1,3); /indexi od 0, 1 element,2 element, 3 ne ); // calch ce uhvalit error, u then se ce pozvat prva funkcija s result = undefined
console.log(arr4.includes(6)); //vraca value,ne bool //Fetch\y
arr.sort( function(a,b){return b - a} ); // sort sa komparatorom (desc) let promise2 = fetch("htips://web1lab2.azurewebsites.net/products?categoryld=1");
arr.reverse(); promise2.then( // obraduje se promise od fetcha
arrEven = arr filter( (x) => x%2==0); function(response) {
for (let element of arr) {console.log(element);} // element if (Iresponse.ok) { throw new Error("Cannot load"); }
for (let index in arr) {console.log(index);} // indeksi else { return response.json(); } // novo obecanje reponse.json()
// classes, objects \ 1,
class Person { function(error) { throw error; }
lastName = "Doe"; )-then( // obraduje se promise od response.json
age = 50; function(response) { console.log("Loaded JSON"); }
constructor(firstNameValue) {this.firstName = firstNameValue;} ).catch( // catch hvata gresku u bilo kojem promiseu
get lastName() {return this.lastName;} function(error) { console.log(error); }
set lastName(newLastName) {this.lastName = newLastName} )
1 /ILoadJsonty
let person = new Person("John"); async function LoadJSON() { // funkcija se izvodi asinkrono
personi.lastName = "Williams”; let promise = await fetch("htips://web/categoryld=1");
person.firstName = "Jake"; // unutar funkcije, await se izvodi sinkrono (ostatak funkcije ceka)
for (let value of Object.values(person1)) {console.log(value)} if (foromise.ok) { throw new Error ("Cannot load"); }
// try-catch \\ else { var jsonContents = await promise.json(); }
try { console.log(jsonContents);
throw "error"; }
} catch(err) { LoadJSON().catch(
console.log(err); (error) => {console.log(error);}
} finally{ )
var x =2; }

o body = common bone <body> /* Extra small devices (phones, 600px and down) */
lel head = document head: aa @media only screen and (max-width: 600px) {...}

let bodyChildrenElements - body.children; // samo html elementi bb I Small devices (ablets and large phones.800px and up) */
’ ’ <h1 class="c2"> Naslov </h1> @media only screen and (min-width: 600px) {...}
let bodyChildren = body.childNodes;
J sadri | tek “a bb" ie ied | Kit <p id="i1" class="c2"> Paragraf </p> /* Medium devices (landscape tablets, 768px and up) */
sadrzi i te st npr “aa Je Jedan clan, te svaki in </body> @media only screen and (min-width: 768px) {...}
let h1 = body.firstElementChild; . !
pt [a Ui. firstChild /* Large devices (laptops, 992px and up) */
| samo’ oot pe h oa. za sve let newP = document.createElement("p"); @media only screen and (min-width: 992px) {...}
he Th - v as oe Chit newP.innerHTML = "novi paragraf"; /* Extra large devices (large laptops, 1200px and up) */
samo film element, -fastChild za sve body.appendChild(newP); @media only screen and (min-width: 1200px) {...}
let answer = prompti("name?", default");
let p = h1.nextElementSibling; // local storage \\
let response = confirm("cookies?");
h1 = p.previousElementSibling; let Is = window.localStorage;
/1 JSON W Module2.js
body = h1.parentElement; Is.setltem("item”, 2);
let person = {firstName:"John" import sum from "./module1.js
p = document.getElementByld("i1"); let keyAtindex0 = Is.key(0);
hd Sel "om: Jf lekior , lastName:"Doe", age:50, eyeColor:"blue"}; let length = Is length: let result=sum(a,b)
= document.querySelector(".c2"); // css selektori let personJSON = JSON. stringify(person); et length = Is.length;
p_h1 = document.querySelectorAll(".c2"); let personFromJSON = JSON. parse(person SON): let item = Is.getltem( item”); Modulel.js
p.style.backgroundColor = "Red"; Is.removeltem("item"); export function sum(a, b){
p.innerHTML = "promjena teksta"; Is.clear(); return a+b }

You might also like