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
Last revision Both sides next revision
dev:javascript [2023/03/29 08:30]
tomas [DOM] 		dev:javascript [2023/04/28 10:39]
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\\
 +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/04/28 10:41
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