Labtehniciweb.files.wordpress.com



HTML:

- creaza un element de tip dictionar

- defineste un cuvant

- creaza o definitie pentru cuvantul de mai sus

- text important

- text accentuat

- nu se inchide

- nu se inchide

- titlu tabel

- celula header

la th si td putem avea colspan si rowspan(cate linii/coloane sa ocupe)

- header tabel; - footer tabel; - body tabel

citate: - phrasing, - flow

- referinta bibliografica

- nu se inchide

Text initial

text - mai multe

CSS:

-proprietati:

width, max-width, min-width,max-height, min-height, height:

color:

visibility:visible|hidden

display: none|inline-block|inline|block

position: absolute|relative|static|fixed – absolute fata de primul parinte cu absolute; relative fata de pozitia lui originala; fixed e fix;

z-index: - doar pentru absolute, fixed, relative

float: left|right|none

clear: both|left|right – nu se mai aranjeaza langa floaturi

background-color:

background-image:

background-repeat: repeat|repeat-x|repeat-y|no-repeat

background-position: |top|left|etc

background-size:

font-family: 'font'

font-size:

font-weight:

text-align: center|left|right|justify

text-decoration: underline|overline|line-through

text-shadow: ,

text-indent:

line-height:

word-spacing:

letter-spacing:

list-style-type: disc|none – pentru

padding-left: margin-left:

padding-right: margin-right:

padding-top: margin-top:

padding-bottom: margin-bottom:

padding: dim1 dim2 dim3 dim4

top right bottom left

border:

border-left:

border-right:

border-top:

border-bottom:

border-color:

border-style: none|solid|dotted

border-width:

border-radius:

border-left-color:

border bottom-width:

@nume{} - creaza un stil nou ce poate fi folosit in proprietati

column-count: - afisare pe coloane

column-gap:

column-rule: solid|dashed|etc

@media screen|print|handheld and …

transform: rotate()|scale()

transition: ease|linear

animation: ;

@keyframes nume-animatie{}

-selectori:

* - tot

tag.clasa – seleteaza tagurile cu clasa 'clasa'

a:link legaturi care nu au fost vizitate

a:visited legaturi care au fost vizitate

a:hover

a:active

a:focus

:first-line

tag:first-of-type - selecteaza primul tag de tipul tagului

:first-letter

tag:first-child - selecteaza toti first-child a tagurilor din DOM ce au tag

:nth-of-type (k) - la fel ca :first-child, numai ca pe al k-lea

:last-child - la fel ca mai sus, numai ca il selecteaza pe ultimul

E > F selecteaza elementele F care sunt copii ai lui E

E + F selecteaza toate elementele F care sunt frati cu E si care urmeaza imediat dupa E

JavaScript:

window.forms['nume']['nume']

element.checked – inputuri radio si checkbox

element.options|selected|selectedIndex pentru

element.value – la inputuri

element.style.color|backgroundColor

document.getElementById('id')

document.getElementsByTagName('tagname')

document.querySelectorAll('selector css');

node.getAttribute('attribute')

node.setAttribute('attribute', 'value')

node.hasAttribute() // boolean

node.removeAttribute() // boolean

node.nodeType : Document=9, Element=1, Text=3, Comment=8

node.nodeName

node.nodeValue

node.previousSibling - Retrieves the previous sibling node and stores it as an object

node.nextSibling

node.childNodes

document.createElement('element')

document.createTextNode('string')

newNode = node.cloneNode(bool) – true pentru a clona si childs

node.appendChild(newNode)

node.insertBefore(newNode,oldNode)

node.removeChild(oldNode)

node.replaceChild(newNode, oldNode)

element.innerHTML

element.textContent

element.className

functieConstructor.prototype.numeFunciteNoua = function

var nouObject: {campuri, functii}

var ceva = Object.create(nouObject)

element.nextElementChild()

element.lastElementChild()

element.nextElementSibling()

element.previousElementSibling()

element.childElementcount()

element.onload |onreset |onsubmit |onchange |onclick |ondoubleclick |onmouseover |ondrag |ondrop|onload

event.type

event.target

event.stopPropagation

event.timeStamp

event.keyCode

event.screenX|Y – pozitia in tot ecranul

event.button - 0(stanga)1(mijloc) 2(dreapta) – pentru mouse

event.clientX|Y – pozitia in fereastra

event.pageX|Y – pozitia in pagina

element.addEventListener('click', handleClick, false)

element.removeEventListener('click',handleClick,true)

var ceva = open(URL, nume, )

ceva.functii

close(URL)

ceva.opener

intr-un iframe: contentWindow – windows corecpunzator si parent – fereastra parinte

ceva = setTimeout(functie, )

clearTimeout(ceva)

ceva = setInterval(functie, ) - se apeleaza la fiecare

clearInterval(ceva)

window.onload|onclose|onresize|onscroll|onselect|onclick|ondblclick|onchange|ondragdrop|onkeydown|onkeyup|onkeypressed|onmousedown|onmouseup|onmouseover|onmousemove

sessionStorage|localStorage.setItem('nume', 'string')

sessionStorage|localStorage.getItem('nume')

sessionStorage|localStorage.removeItem('nume')

sessionStorage|localStorage.clear()

-array:

ceva.forEach(function(curent, indice))

ceva.map(function(curent)) - schimba elementele returnandu-le schimbate

ceva.reduce(function(unu, altu)) – compara elementele cate doua si returneaza unul dintre ele

JSON.stringify() - intoarce un string

JSON.parse('string')

- transforma un string in JSON

jQuery:

window.jQuery = window.$ = jQuery = $

$(ceva) – transforma ceva intr-un obiect jQuery, unde ceva poate fi: selector CSS, element DOM, text html

$('selector').ready(function)

$('selector').click(function)

$('selector').css('proprietate','valoare')

$('selector', element) – intoarce multimea de elemente descendente ale lui element care verifica 'selector'

$('selector').eq(i) – intoarce un obiect jQuery

$('selector')[i] – intoarce un element DOM

$('selector').append |prepend|after|before|replaceWith('text html valid') – append, prepend inauntru, after, before afara

$('text html valid').appendTo|prependTo|insertAfter|insertBefore|replaceAll('selector')

$('selector').each(function( index, current))

$('selector').show|hide|toggle|slideUp|slideDown|slideToggle|fadeIn|fadeOut|fadeToggle(, [callback])

$('selector').text() - intoarce continutul ca text fara marcaje

$('selector').html() - intoarce continutul ca text cu marcaje

$('selector').text('text') - modifica continutul

$('selector').html('text html') - modifica continutul interpretand marcajele

$('selector').value() - intoarce valoarea atributului value

$('selector').value('valoare noua') - modifica valoarea atributului value

$('selector').attr('atribut', 'valoare noua')

$('selector').removeAttr('atribut')

$('selector').css('proprietate', 'valoare noua')

$('selector').hasClass|addClass|removeClass|toggleClass('clasa')

$('selector').animate({: ''[+=|–=]valoare'', ...}, )

$('selector').keydown(function(event)) - de obicei window

$('selector').bind('event', function (event)) - unde event este un eveniment din DOM

$('selector').unbind('event')

event.wich

$('selector forma').submit(function)

$('selector forma').serialize() - intoarce un string query pentru URL; poate fi folosit pentru POST drept data

AJAX:

$('selector').load('url si selector', function(data, statusCode)) - statusCode = 'error' si 'succes' si data contine tot fisierul de la url

$.get('url', function (data, statusCode))

$.post('url', { 'attr': val, ...}, function(data, textStatus))

$.ajax({ type: 'GET'|POST, url: 'url', data: {'nume':'val', ...},

success: function (data, statusCode),

error: function (data, statusCode),

})

daca url este un fisier XML => se tranforma data intr-un obiect jQuery

daca url este un fisier JSON => data este un Array, se acceseaza atributele prin puncte

$.getJSON('url.json', function (data))

................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download