Tomas Lipensky - vedomostni koutek

Trace:

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision 		Previous revision
dev:javascript [2023/03/29 08:30]
tomas [DOM] 		dev:javascript [2023/04/28 10:41] (current)
tomas [yarn]
Line 5: Line 5:
 ====JS servery==== ====JS servery====
 [[https://cs.wikipedia.org/wiki/Node.js|node.js]] ... javaskriptovy serverovy engine\\ [[https://cs.wikipedia.org/wiki/Node.js|node.js]] ... javaskriptovy serverovy engine\\
- ... manazer modulu pro node-js\\+node main.js ... spustí js soubor, třeba console.log("ok")\\
  
 ==== npm ==== ==== npm ====
Line 17: Line 17:
 npm whoami ... zobrazí uživatele v repozitáři\\ npm whoami ... zobrazí uživatele v repozitáři\\
 npm whoami --registry=https://npm.pkg.github.com ... v konkrétním repozitáři\\ npm whoami --registry=https://npm.pkg.github.com ... v konkrétním repozitáři\\
 +npm install socket.io ... nainstaluje knihovnu\\
 ==== yarn ==== ==== yarn ====
 balíčkový manažer pro nodejs nad npm balíčkový manažer pro nodejs nad npm
  
 +package.json ... seznam balíčků k instalaci a skriptů\\
 +yarn.lock ... zámek na verze npm balíčků\\
 +
 +yarn add react-native-cli ... nainstaluje react-native-cli i se závistlostma\\
 +yarn install --update-checksums ... provede instalaci balíčků i se závistlostma z definičního souboru package.json\\
 ====Nastroje==== ====Nastroje====
 [[https://storybook.js.org/|Storybook]] ... nastroj na vyvoj izolovanych komponent stranek pro React, Vue a Angular\\ [[https://storybook.js.org/|Storybook]] ... nastroj na vyvoj izolovanych komponent stranek pro React, Vue a Angular\\
 +[[https://www.jslint.com]] ... linter - kontroluje kód - hledá chyby v syntaxi i čistotě kódu\\
 +[[https://refresh-sf.com/yui|yui compressor]] ... kompresuje kód aby byl kratší\\
  
 ====Knihovny==== ====Knihovny====
Line 127: Line 134:
 element.childNodes ... vnořené HTML objekty\\ element.childNodes ... vnořené HTML objekty\\
 element.style.border = '1px solid #000'; ... nastaví CSS rámeček\\ element.style.border = '1px solid #000'; ... nastaví CSS rámeček\\
 +element.setAttribute('style', 'witdth:100px;height:100px') ... dynamické měnění stylu\\
  
 == Přidání elementu == == Přidání elementu ==
Line 164: Line 172:
 objs.sort(compare);</code> objs.sort(compare);</code>
  
-    +==== JQuery ==== 
-   +%%<script src="jquery.js"></script>%% ... inicializace jquery\\ 
 +$(window).ready(function() {alert('Loaded')}); ... selektor - stránka, stav - načteno => vyskočí hláška\\ 
 +var MyID = $('#elementID') ... sekektor html značky s id='elementID'\\ 
 +var tucne = $('.bold') ... selektor značek s třídou class='bold'\\ 
 +var body =  $('body') ... selektor značky <body>\\ 
 +var names =  $('[name="name"]') ... selektor značek, co mají v sobě atribut name="name"\\ 
 +$("textarea").focus(function() { $('.bold').css("display", "none") }) ... po kliknutí na <textarea> se změní css styl na none\\ 
 +$("input").hover(function() {$(this).blur()}), function() {$(this).css("border", 0)}); ... při najetí na input daný objekt při najetí myší se rozmlží, při odjetí myši se změní css styl\\
  
 +akce: keypress(), mouseup(), mousedown(), mouseover(), mouseenter(), mouseleave, onmouseout, click, dlbclick, focusin, focusout\\
 +akce na objektu append("přidáno")\\
 +$(this).next().toggle() ... když display=none, tak zobrazí, a naopak\\
 +.hide(), .show() ... skryje, zobrazí, paramert může být jak rychle s zmizí, nebo se zobrazí v ms\\
 +fadeIn, fadeOut, fadeToggle, slideUp, slideDown, slideToggle ... slide - bude překryto dalšími objekty a tím zmizí\\
 +.submit() ... odešle formulář\\
 +keypress( function(e) { $(this).append(e.keyCode ? e.keyCode : e.which)} ) ... po stisknutí přidá číslo znaku, jež byl zmáčknutý. některé browsery požívají which, některé keyCode\\
 +$(this).html() ... dostanu vnitřek html značky\\
 +$("div").html("nic") ... změním vnitřek značky, v div se objeví "nic"\\
 +$(this).animate({width: "+=100"}) ... zvětší objekt\\
 +$(this).attr("href") ... vrátí atribut href\\
 +$(this).attr("href", "http://tomas.lipensky.cz/") ... změní atribut href\\
 +$(this).slideUp(3000, function(alert("kuk"))) ... callback, jak skončí slideUp, tak se provede callback funkce\\
 +$("#tady").load("file.txt") ... do elementu #tady načte obsah souboru file.txt\\
 +$.ajax() = jQuery.ajax()\\
 +$.ajax({url: "file.txt", success: function(data)}) ... po načtení provede funkci, více na [[http://api.jquery.com/jQuery.ajax]]\\
Last modified: 2023/03/29 08:30
GNU Free Documentation License 1.3 Except where otherwise noted, content on this wiki is licensed under the following license: GNU Free Documentation License 1.3