Arvaapa mitä nämä kaksi esimerkkiä tulostaa:
Esimerkki 1:
var a = 4;
var b = a;
document.writeln(a,b);
Esimerkki 2:
var a = 4;
var b = a ;
document.writeln(a,b);
JavaScript ja ++
Anonyymi
53
722
Vastaukset
- Anonyymi
Tässä lisää ihmettelemistä:
Esimerkki 1
var a = 10;
a ;
console.log(a);
Esimerkki 2
var a = 10;
a;
console.log(a); - Anonyymi
Tätä ei taida muut kielet osata:
var result = 33 - 11 / 3;
document.writeln(result); - Anonyymi
Javascript ei ole tuttu kieli, mutta arvataan ekaan kysymykseen 5,5 ja 5,4 (jos writeln tulostaa lukujen välisen pilkun).
Tokassa kysymyksessä molemmat tulostavat 11.
Kolmas tulostaa 29,33333 tai jos se osaa tulostaa murtoluvun, niin 29 1/3.- Anonyymi
Hyvin meni, tarkkuutta oli viimeisessä useampi desimaali (29.333333333333332).
Sitähän minä tässä ihmettelin, että tyhjiltään ilman mitään muuttujien tyypityksiä (char, int, short int, long int, float tai double) antaa vastaukseksi liukuluvun noinkin monen desimaalin tarkkuudella, odottelin jotain kokonaislukua.
- Anonyymi
Mutta, nyt löytyy JavaScriptin erikoisuus merkin käytössä, joka koskee kumpaakin document.write() ja console.log() tulostusta, nimittäin, jos tulostettava alkaa merkkijonolla, myös merkillä liitetyt luvut käsitellään merkkijonona.
Normaali tilanne::
var a = 1;
var b = 2;
console.log( a b "kpl" ) // Tulostaa 3kpl
Erikoista tulostusta:
var a = 1;
var b = 2;
console.log( "No:" a b ) // Tulostaa No:12
Ja ihan sama tulostatko consoliin vai dokumenttiin.- Anonyymi
Jos tuo ei tuntunut erikoiselta, niin testaapa tämä, jossa aritmeettinen tehtävä on kertolasku:
var a = 1;
var b = 2;
console.log( "No:" a * b ) // Tulostaa No:2
Nyt taas käsitelläänkin lukuja numeroina eikä merkkijonoina kuten merkin kanssa oli.
- Anonyymi
console.log() tulostuksessa käytettävät erikoismerkit ovat kutakuinkin samoja kuin pythonissa, kun taas document.write() tulostuksessa tekstin muotoilu tapahtuu HTML tageja käyttäen.
document.write("<p><b>JavaScript</b> on mielenkiintoinen komentosarjakieli.</p>"); - Anonyymi
Tässä aiemin pyöriteltiin neljän miljardin silmukoita monella kielellä, JavaScript ei vaikuttanut kovinkaan nopealta tässä tehtävässä. Ajan ottoa ei vielä osaa tarjota mutta While silmukka jo onnistuu näin:
let n = 0;
while (n <= 4000000000) {
n ;
} - Anonyymi
Selain vaikuttaa olevan hyvin epävakaa kun aloitetaan tarkastelemaan millisekunneissa jotain suoritusta. Tämäkin testi vaihteli 40 - 50 sekunnin välillä.
var Start = performance.now()
let n = 0;
while (n <= 4000000000) {
n ;
}
var Stop = performance.now();
var End = (Stop - Start) / 1000;
console.log( End.toFixed(2) );
Tulos tällä kertaa oli 46.43 sekuntia, ei juuri kehumista. Mutta JavaScript näyttää sisältävän tähän tarkoitukseen oikein oman funktionsakin performance.now(). Ja toFixed(2) funktio rajaa desimaalit kahteen. Muutapa siinä ei uutta olekaan. - Anonyymi
GW-BASIC vai oliko VBA tai joku vastaava (en muista), jossa ohjelman alussa asetettiin määriteltiin direktiivi, joka esti uuden muuttujan käyttöön oton ilman esittelyä, tämä sama ominaisuus löytyy myös JavaScript kielestä.
'use strict';
a = "Hello World";
console.log(a);
'not use strict';
a = "Hello World";
console.log(a); - Anonyymi
Joko osaamme paikallistaa virheet. Tässä on sivu ( https://javascript.info/article/devtools/bug.html ), joka sisältää ulospäin näkymättömän virheen. Mikä virhe on kyseessä?
Joo, aivan liian helppo tehtävä, niille, jotka ovat aieminkin HTML ja JavaScript koodin perehtyneet, mutta muilla saattaakin mennä tosi pitkään virhettä hakiessa. - Anonyymi
Aika mielenkiintoisia on kyullå pohdisdella kaikenlaisia... kuitrnkin
- Anonyymi
struct CUSTOMVERTEX {FLOAT X, Y, Z; D3DVECTOR NORMAL;};
#define CUSTOMFVF (D3DFVF_XYZ | D3DFVF_NORMAL)
mitä tarkoittaapio tuolainen - Anonyymi
setTimeout(Tehtävä, Aika), hyvin käyttökelpoinen funktio, joka asettaa ajan jonka kuluttua suoritetaan annettu tehtävä. Aika annetaan millisekunneissa. Tein pienen esimerkin joka kirjoittaa Count muuttujan sisältöä, <imput> elementin kenttään. Samalla tämä Count toimii aikana, jonka jälkeen uudestaan palataan kirjoittamaan muuttujan arvo.
<!DOCTYPE html>
<html> <head> <title>Hidasteluja</title> </head>
<body>
<input type="text" id="Tekstikenttä">
<script>
var Count = 1;
function WriteCount() {
document.getElementById("Tekstikenttä").value = Count;
Count = Count 1;
setTimeout(WriteCount, Count); }
WriteCount();
</script>
</body>
</html>
Tämä on siis HTML sivu jossa on JavaScript lohko mukana. En usko että olet vastaavaa aiemmin testannut, vaikka tätä setTimeout() funktion esimerkkejä on runsaasti tarjolla. Siis tässä Count arvo kasvaa koko ajan, ja samalla harvenee uuden arvon kenttään kirjoittaminen, mitä pitempään ajat sitä hitaammaksi käy. Suorituksen pysäyttämismahdollisuutta ei ole, joten vain sivun sulkeminen katkaisee silmukan. - Anonyymi
Tässä esimerkki, kuinka voit esittää kysymyksen. Huomaa kun jätämme <title></title> lohkon pois <head></head> tagien välistä, käyttää selain titlen sijasta tiedosto nimeä.
<!DOCTYPE html>
<html><head><meta charset="UTF-8"></head><body>
<script>
let answer = "z";
const OKanswer = "Elias Lönnrot";
while (answer != OKanswer) {
answer = prompt("Kuka kirjoitti kalevalan?");
if (answer.toLoweCase != OKanswer) {
alert("Väärin meni! Vastaus ei ole: " answer); }; };
</script>
<script>
if (answer != OKanswer) {
document.write("<h1>No voi ei, se oli " OKanswer "</h1>") }
else {document.write("<h1>Hienoa, onnistuit!</h1>") }
</script>
</body> </html> - Anonyymi
Edellisestä jäi mainitsematta prompt() funktion toinen parametri, eli se hyväksyy oletus vastauksen asettamisen. Tämä seuraava sinun tulee suorittaa "Console" ikkunassa (F12), kopioit vain tekstin liität sellaisenaan, ja painat "Enter".
var kysymys;
kysymys = prompt("Sanalaskuri / merkkilaskuri selvittää nopeasti mm. kuinka monta sanaa, merkkiä ja lausetta tekstisi sisältää. Haluatko sellaisen?", "Haluan, tietysti haluan.");
if (kysymys != null) {
alert('Se on riittävän yksinkertainen, jotta voimme rakentaa sellaisen. Teemme sen jossakin vaiheessa'
' ja paljon, paljon muuta.' "\r\n\r\n" 'Pysy mukana :)');
}
Huomioi, että jos painat "Peruuta" painiketta, et saa alert() funktiolla tuotettua viestiä. Kiinnitä huomiota myös siihen kuinka tuotamme pitkän viestin, ja saamme rivinvaihtoja aikaan.- Anonyymi
Lisätään vielä että JavaScript sisältää kolme vuorovaikutteista ponnahdusikkunaa (dialog box); prompt(), confirm() ja alert(), eikä näihin mihinkään voida sisällyttää muuta kuin tekstiä.
- Anonyymi
else if lausetta voit käyttää niin monesti kuin on tarvetta, mutta kannattaa harkita switch(..) {..} lauseen käyttöä jos vertailtavia vaihtoehtoja on paljon, näin sanottiin jossakin ohjeessa, ei kerrottu miksi. Esimerkin testaaminen paina ensin F12 ja valitse "Console" välilehti, kaikissa Chromium pohjaisissa selaimissa, ja FireFox pohjaisissa selaimissa oliko se Ctrl Shift K vai Ctrl Shift I, en muista.
var luku; var msg;
name = prompt("Anna numero 0 .. 4");
if (name == "0") { msg = "Nolla"; }
else if (luku == "1") { msg = "Yksi"; }
else if (luku == "2") { msg = "Kaksi"; }
else if (luku == "3") { msg = "Kolme"; }
else if (luku == "4") { msg = "Neljä"; }
else { msg = "Tyhjä"; }
alert(msg)- Anonyymi
Haluat noihin else if:eihhin varmaan name=="1" jne?
- Anonyymi
Anonyymi kirjoitti:
Haluat noihin else if:eihhin varmaan name=="1" jne?
Hienoa että joku edes ymmärtää mitä niissä tavoitellaan, olet oikeassa, tuo tuli ulos keskeneräisenä, kun "nuolinäppäin ylös", antaa vanhan uudelleen muokattavaksi, ilman että kaiken tarvitsee uudelleen kirjoittaa, syntyy näitä sekaannuksia.
- Anonyymi
Nyt selvisi sellainen asia kuin että muuttujia voidaan määritellä pilkulla erotettuna, näin:
var i=0, j=10, x='testi'; - Anonyymi
Nyt yritän perehtyä tiedon tallentamiseen, ja aloitin localStorage varastoon tutustumisen. Ja heti tuli vastaan outoja juttuja, nimittäin yritin tulostaa for -silmukassa varaston avaimet (key). Ohjeitakin löytyi ihan riittävästi, mutta kun sain kaikissa niissä vääriä tulosteita. Joten poikkesin ohjeista ja tein omin avuin for silmukan jonka tulostuskin tuotti oikeita vastauksia.
OMA
var key;
var i = 0;
for (key in localStorage) {
i = i 1;
console.log(key);
if (i >= localStorage.length) { break; }
}
OHJEET NEUVO NÄIN
var key;
for ( key in localStorage ){
console.log(key)
}
Mutta tämä oppaan silmukka tuotti seuraavan listan, vaikka varastossa oli vain "test" avain olemassa ja sillä arvo.
test
length
key
getItem
setItem
removeItem
clear
Mikä tässä ohjeen silmukassa mättää, noiden ylimääräisten takia tein sen oman silmukan, joka on jo asteen verran monimutkaisempi.- Anonyymi
For...in käy läpi myös objektin prototyyppi-ketjun, joten sieltä löytyy noita muita propertiksiä, vaikka ne ei suoraan itse localStorage-objektissa olekaan. Luultavasti localStoragea ei ole tarkoitettu läpikäytäväksi, koska sellaista funktiota ei ole sinne tehty, mutta yksi tapa, jolla voi käydä läpi vain objektin "omat" propertyt on funktio Object.getOwnPropertyNames().
for (let key of Object.getOwnPropertyNames(localStorage)) console.log(key);
Joku "_hjid" ainakin mulle vielä tulee (lienee selainkohtaista mitä kaikkea tauhkaa siellä on).
Huomaa, että nyt käytetään of:fia, sillä funktio palauttaa listan. Lisäksi, kun laittaa tuon let -määrittelyn muuttujalle key luupin sisään, niin se on lokaali muuttuja, joka näkyy vain luupin sisällä, eikä näin sotke asioita, jos vaikka key olisi jossain muualla määritelty. Itse asiassa siinä voisi käyttää myös "const key" -määrittelyä. Se toimii, vaikka key luupissa muuttuukin. Se taitaa mennä niin, että let/const -tavalla muuttuja key on joka kierros niinkuin siinä "omassa freimissään". Tästä on suunnaton apu, kun esim. asetetaan luupissa jotain event listenereitä, joihin tulee joku indeksi mukaan: jos sen laittaa var:illa, niin muuttujan arvoksi jää se mihin luuppi loppui (ja se tulee olemaan se mitä arvoa jokainen event listeneri käyttää), mutta let/const:illa jokaiseen "menee omansa". Noh, tämä nyt taisi mennä vähän ohi asiasta, mutta tulipahan vain mieleeni :D. - Anonyymi
Anonyymi kirjoitti:
For...in käy läpi myös objektin prototyyppi-ketjun, joten sieltä löytyy noita muita propertiksiä, vaikka ne ei suoraan itse localStorage-objektissa olekaan. Luultavasti localStoragea ei ole tarkoitettu läpikäytäväksi, koska sellaista funktiota ei ole sinne tehty, mutta yksi tapa, jolla voi käydä läpi vain objektin "omat" propertyt on funktio Object.getOwnPropertyNames().
for (let key of Object.getOwnPropertyNames(localStorage)) console.log(key);
Joku "_hjid" ainakin mulle vielä tulee (lienee selainkohtaista mitä kaikkea tauhkaa siellä on).
Huomaa, että nyt käytetään of:fia, sillä funktio palauttaa listan. Lisäksi, kun laittaa tuon let -määrittelyn muuttujalle key luupin sisään, niin se on lokaali muuttuja, joka näkyy vain luupin sisällä, eikä näin sotke asioita, jos vaikka key olisi jossain muualla määritelty. Itse asiassa siinä voisi käyttää myös "const key" -määrittelyä. Se toimii, vaikka key luupissa muuttuukin. Se taitaa mennä niin, että let/const -tavalla muuttuja key on joka kierros niinkuin siinä "omassa freimissään". Tästä on suunnaton apu, kun esim. asetetaan luupissa jotain event listenereitä, joihin tulee joku indeksi mukaan: jos sen laittaa var:illa, niin muuttujan arvoksi jää se mihin luuppi loppui (ja se tulee olemaan se mitä arvoa jokainen event listeneri käyttää), mutta let/const:illa jokaiseen "menee omansa". Noh, tämä nyt taisi mennä vähän ohi asiasta, mutta tulipahan vain mieleeni :D.Aivan, tuo onkin paljon parempi ja lyhyempi kuin tuo minun viritys. No se niistä avaimista. Tässä minulla on sama localStorage haku arvojen osalta. Voiko tämänkin tehdä helpommin.
var len = localStorage.length;
for ( let i = 0; i < len; i ) console.log( localStorage.getItem( localStorage.key( i ) ) ); - Anonyymi
Anonyymi kirjoitti:
Aivan, tuo onkin paljon parempi ja lyhyempi kuin tuo minun viritys. No se niistä avaimista. Tässä minulla on sama localStorage haku arvojen osalta. Voiko tämänkin tehdä helpommin.
var len = localStorage.length;
for ( let i = 0; i < len; i ) console.log( localStorage.getItem( localStorage.key( i ) ) );Tuo vaikuttaa hyvältä. Noin se kannattaa tehdäkin se läpikäynti, en itse tuota key() funktiota muistanutkaan.
Muuttujan len voi laittaa vielä for:in sisään näin:
for ( let i = 0, len=localStorage.length; i < len; i ) ... - Anonyymi
Anonyymi kirjoitti:
Tuo vaikuttaa hyvältä. Noin se kannattaa tehdäkin se läpikäynti, en itse tuota key() funktiota muistanutkaan.
Muuttujan len voi laittaa vielä for:in sisään näin:
for ( let i = 0, len=localStorage.length; i < len; i ) ...Näin on, var komennon käyttöä muuttujien määrittelyssä kehotetaan välttämään, koska niiden muuttujien näkyvyysalue on globaali. Jossakin ohjeessa jopa väitettiin että var voidaan korvata let ja const määrittelyjä käyttäen kokonaan. Const komentohan teki muuttujasta vakion jonka arvoa ei myöhemmin voi muuttaa.
localStorage on tarkoitettu string (merkkijono) tyyppisten arvojen tallennukseen, joten kuvien tallennukseen on keksittävä muu ratkaisu, kuten kuvan osoitteen tallentaminen, joka ei sekään tunnu kovin luotettavalta keinolta. Näistä normaaleista perusmenetelmistä:
setItem(name, value) avaimen ja arvon lisäys,
removeItem(name) avaimen ja arvon poisto,
getItem(name) arvon poiminta nimellä
key(index) arvon poiminta numerolla
löytyy kivuttomasti helposti omaksuttavaa tietoa, mutta on vielä yksi, jonka osilta mainitaan ettei se olisi tuettu FireFox selaimessa ja se on:
clear()
joka poistaa kerralla kaikki arvot. Minulla ei ole FireFox selainta, enkä voi siksi sanoa vieläkö se tänä päivänäkin pitää paikkansa.
- Anonyymi
Jos FireFox ei sisällä samanlaista JavaScript tukea localStoragen hallinnassa, on näitä erikoisuuksia muisakin selaimissa. Tämä seuraava toimii ainostaan IE8:
sessionStorage.begin();
sessionStorage.name = "Seppo";
sessionStorage.commit();
Nimittäin nämä begin() ja commit() komennot puuttuvat muista selaimista.
localStorage tallennusten tulostus jäi vielä kaipaamaan yhdistettyä avain ja arvoparin tulostusta, siispä se tässä:
for (let i = 0, len = localStorage.length; i < len; i ){
let key = localStorage.key(i);
let value = localStorage.getItem(key);
alert(`AVAIN: ${key} ARVO: ${value}`);
}
Huomioi oikeat hipsut! - Anonyymi
Vielä samasta localStoragesta, nimittäin kiinnitin huomiota tuohon järjestykseen, koska se ei ole avain/arvo parien luontijärjestys, se ei ole myöskään aakkostettu mitenkään, eikä siihen näytä vaikuttavan avaimen eikä arvon sisältö. Onko sinulla jokin selitys tälle järjestykselle. Tällä kertaa GIF animaationa. Kaikki alkaa localStoragen tyhjennyksellä, jonka jälkeen sijoitetaan 4 uutta avain/arvo paria, ja lopuksi tulostetaan.
Ehkä kerkisit kuvitella että jo nyt unohdin, miten asia hoidetaan näppärästi, kun tuossa edellisessä tuli vain osittain noudatettua ohjettasi, en unohtanut, nyt tein sen antamasi ohjeen mukaan.
https://s7.gifyu.com/images/tallennusjarjestys.gif
Arvot sijoitetaan näin:
localStorage.setItem('avain1', 'arvo1');
localStorage.setItem('avain2', 'arvo2');
localStorage.setItem('avain3', 'arvo3');
localStorage.setItem('avain4', 'arvo4');
mutta tulostuvat näin:
AVAIN: avain3 ARVO: arvo3
AVAIN: avain4 ARVO: arvo4
AVAIN: avain2 ARVO: arvo2
AVAIN: avain1 ARVO: arvo1- Anonyymi
Täällä:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
sanotaan
"A for...in loop iterates over the properties of an object in an arbitrary order"
eli järjestys on mikä sattuu. Kai se jotenkin tulee siitä minkälaiseen tietorakenteeseen nuo sitten tallennetaankaan (hashtable:hän se objekti taitaa olla)
Ja
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames
tuo tuottaa samassa järjestyksessä.
Muuten, Object.keys() on ehkä vielä parempi (lyhyempi ainakin kirjoittaa, en tiedä onko noilla sitten mitään toiminnallista eroa getOwnPropertyNames():n kanssa)
localStorage.setItem('avain1', 'arvo1');
localStorage.setItem('avain2', 'arvo2');
localStorage.setItem('avain3', 'arvo3');
localStorage.setItem('avain4', 'arvo4');
console.log(Object.keys(localStorage));
//--> ["avain3", "avain4", "_hjid", "avain2", "avain1"]
Ai niin ja tuo _hjid:hän on näköjään tämän suomi24:n joku juttu, joka siellä oli jo valmiiks. (Kun satuin tällä sivulla tuota testaamaan.)
Ja tuolla keys()-metodista:
https://developer.mozilla.org/en-US/docs/Web/API/Storage/key
"The order of keys is user-agent defined, so you should not rely on it."
Joo, mutta kaiken kaikkiaan ei tuota localStoragea kai ole tarkoitettu läpikäytäväksi(?), vaan ne avaimet, joilla tietoa on tallennettu, täytyy tietää ennalta ja sitten vain hakea arvot getItem():lla. - Anonyymi
Laittamani viesti näköjään poistunut : (. Noh,
Object.keys(localStorage)
siis onkin vielä parempi tapa tuohon kaikkien avainten saantiin: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys . Järjestys jossa avaimet tuotetaan on "arbitrary" (tullee siitä miten ne hashtableen häshätäänkään). Kuitenkin se on aina sama kuin mikä for...in loopin järjestys. Storagen key()-metodin järjestyksestä sanotaan "toteutuskohtainen" eikä siihen pidä luottaa. Mutta yleensähän tuota storagea käytettäneenkin, niin että avain/avaimet on aina ennalta tiedossa ja sitten vain haetaan haluttu getItem():lla. Jos esim. taulukon haluaa tallentaa, niin (koska sinne pitää laittaa stringi,) käytetään JSON.stringify() ja JSON.parse():a
localStorage.setItem("avain1", JSON.stringify([1,2,3]));
var taulu = JSON.parse(localStorage.getItem("avain1"));
console.log(taulu); - Anonyymi
Anonyymi kirjoitti:
Laittamani viesti näköjään poistunut : (. Noh,
Object.keys(localStorage)
siis onkin vielä parempi tapa tuohon kaikkien avainten saantiin: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys . Järjestys jossa avaimet tuotetaan on "arbitrary" (tullee siitä miten ne hashtableen häshätäänkään). Kuitenkin se on aina sama kuin mikä for...in loopin järjestys. Storagen key()-metodin järjestyksestä sanotaan "toteutuskohtainen" eikä siihen pidä luottaa. Mutta yleensähän tuota storagea käytettäneenkin, niin että avain/avaimet on aina ennalta tiedossa ja sitten vain haetaan haluttu getItem():lla. Jos esim. taulukon haluaa tallentaa, niin (koska sinne pitää laittaa stringi,) käytetään JSON.stringify() ja JSON.parse():a
localStorage.setItem("avain1", JSON.stringify([1,2,3]));
var taulu = JSON.parse(localStorage.getItem("avain1"));
console.log(taulu);Joo, tämän taulukko homman jätän väliin, kun en ole tähän "JSON" juttuun perehtynyt ollenkaan. Mutta tämä linkkisi takaa löytynyt tapa onkin yksinkertaisin, eikä tulostus eikä asettaminenkaan voi enää tästä helpommaksi mennä:
const x = {
'avain 1': 'arvo 1',
'avain 2': 'arvo 2',
'avain 3': 'arvo 3',
};
console.log(Object.keys(x));
console.log(Object.values(x));
Hyvä näin.
- Anonyymi
SessionStorage on välilehti kohtainen tallennus, ja kooltaan 5Mt, tallenteet menetetään kun välilehti suljetaan.
LocalStorage taas säilyttää tietonsa niin kauan kunnes ne tuhotaan, kooltaan myös 5Mt.
Vielä käytettävissä olevan tilan voit selvittää tuolla:
http://dev-test.nemikor.com/web-storage/support-test/ - Anonyymi
SessionStoragen ja LocalStoragen käsittely saa nyt vähäksi aikaa riittää.
Evästeet on toinen tapa tallentaa tietoa. Tämä tallennustavan rajoitukset vaihtelee enemmän selainkohtaisesti, kuin mitä storage tavalla tapahtuu. Luultavasti jokainen selain pystyy tallentamaan 80 kilotavua yhtä verkkotunnusta kohti. - Anonyymi
Lazarus sai uuden päivityksen, pistän tämän JavaScript kirjoittelun vähäksi aikaa seis ja tutustun Lazaruksen uusiin ominaisuuksiin. Tein kuitenkin esimerkin localStoragen käyttämisestä sivulatauksia tallentavan JavaScriptin varastona.
https://pastebin.com/YPg0PdZ8 - Anonyymi
Pitihän se vielä rustata kävijä (vieras) laskuri, joka varastoi vierailujen määrän evästeeseen (cookie). Yllättävän pitkäksi tuhrautui, mutta toimii tämäkin. Eväste säilyy yhden vuoden viimeisestä vierailusta.
https://pastebin.com/gChrH7cM
Huomioi, että et voi kasvattaa vieraslaskurin tilaa käynnistämällä sivun tiedostona C:\Cookie-laskuri.html vaan evästeiden asettamiseen vaaditaan HTTP-protokollan käyttö, eli avaat sivun http://localhost/Cookie-laskuri.html- Anonyymi
Tämä laskuri näyttää vain yhden (oman) selaimen käynnit sivulla: cookie = omaselaincookie., mikä kasvattaa arvoa. Jos halutaan sivulle laskuri kaikista sivulla käynneiistä, se vaatii laskurin tallennuksen palvelinpäähän: joko tehdään laskuri palvelinkoodiin jja tallennus tiedostoon tai kantaan, tai lähetetään käyntitieto johonkin toiseen paikkaan tallennettavaksi ja näytetään vain tulos palvelinsivulla.
Esimerkki yksinkertaisesta php-laskurikoodista
http://www.hongisto.info/wp/category/oppaat/php/
Esimerkki toisesta vaihtoehdosta on joku laskuri/statistiikkasivusto, minkä agentin koodi lisätään sivulle, yleensä js, mikä lähettää tiedon ko l/s-sivustolle ja sitten näyttää ko sivulla
(esim gostats, se näyttää laskurin sivulla kuvana, mutta kerää muutakin tietoa: loggautumalla gostatsiin sivun omistaja voi nähdä tarkempaa tietoa kävijöistä, mm kävijöiden ip:t) (Javascript-blockerilla voi estää js-agentit, myös adblockerit kute ublock origin estää niitä) - Anonyymi
Anonyymi kirjoitti:
Tämä laskuri näyttää vain yhden (oman) selaimen käynnit sivulla: cookie = omaselaincookie., mikä kasvattaa arvoa. Jos halutaan sivulle laskuri kaikista sivulla käynneiistä, se vaatii laskurin tallennuksen palvelinpäähän: joko tehdään laskuri palvelinkoodiin jja tallennus tiedostoon tai kantaan, tai lähetetään käyntitieto johonkin toiseen paikkaan tallennettavaksi ja näytetään vain tulos palvelinsivulla.
Esimerkki yksinkertaisesta php-laskurikoodista
http://www.hongisto.info/wp/category/oppaat/php/
Esimerkki toisesta vaihtoehdosta on joku laskuri/statistiikkasivusto, minkä agentin koodi lisätään sivulle, yleensä js, mikä lähettää tiedon ko l/s-sivustolle ja sitten näyttää ko sivulla
(esim gostats, se näyttää laskurin sivulla kuvana, mutta kerää muutakin tietoa: loggautumalla gostatsiin sivun omistaja voi nähdä tarkempaa tietoa kävijöistä, mm kävijöiden ip:t) (Javascript-blockerilla voi estää js-agentit, myös adblockerit kute ublock origin estää niitä)Olet oikeassa, kun tajusin mitä kirjoitit, oikein säpsähdin, voi hitto, koko ajan sitä esittelin laskurina joka seuraa kaikkien kävijöiden vierailuja. Tosiaankin se laskee vain omat käynnit.
- Anonyymi
Vieraslaskurin toteuttaminen niin että tieto tallennetaan teksti tiedostoon, vaikuttaa olevan vähemmän mielekäs tapa mutta mahdollinen, joten jätän välistä pois.
- Anonyymi
Kuka osaa selittää nämä JavaScriptin oudot funktiot:
(() => 1 2 3 4 )()
// 10
Onko nämä vain "Console" ikkunassa tavoitettavia oikoteitä ?- Anonyymi
Samaten tämä, eihän tuo anna muuta kuin virheen, ja mitä tarkoittaa => merkintä.
(diameter) => diameter * 3.14159265;
console.log(diameter) - Anonyymi
Törmäsin verkossa luettavaan PDF-kirjaan: https://leanpub.com/javascriptallongesix/read#leanpub-auto-about-javascript-allong
Ja tuo onkin täynnä näitä outoja arvoituksia. - Anonyymi
Anonyymi kirjoitti:
Samaten tämä, eihän tuo anna muuta kuin virheen, ja mitä tarkoittaa => merkintä.
(diameter) => diameter * 3.14159265;
console.log(diameter)Nuolifunktiot ovat ES6:ssa tullut "uutuus". Ne määritellään laittamalla parametrit sulkuihin (tai jos vain yksi parametri, niin sulut voi jättää pois), sitten nuoli =>, ja lopuksi funktion palauttama arvo (yhtenä lausekkeena) tai voi laittaa myös lohkon {...}, jossa on return-lause (tai eihän returnia välttämättä tarvitse, jos funktio ei palauta mitään (ts. palauttaa undefined)).
Esim.
x => 2*x
(x, y) => x y
Tässä esimerkki lohkon kanssa
x => {let y = x 1; return x*y;}
Nuolifunktioissa on this-referenssin kannalta sellainen jippo, että ne eivät "tee omaa this:siään" vaan nuolifunktion sisällä this viittaa siihen, mihin se viittaa nuolifunktion ulkopuolella.
Tuossa sinun esimerkissä
"
(diameter) => diameter * 3.14159265;
console.log(diameter)
"
diameteter on tuossa vain parametri, joten se ei ole määritelty nuolifunktion ulkopuolella (missä tuo console.log on). Jos haluat tulostuksen tapahtuvan funkion sisällä, niin käytä lohko-tapaa (lisäksi laitetaan funktio muuttujaan, jotta sitä voi kutsua myöhemmin):
const getPerimeter = diameter => {
console.log(diameter );
return diameter * Math.PI; //pii löytyy Math-kirjastosta
};
getPerimeter(2); - Anonyymi
Anonyymi kirjoitti:
Nuolifunktiot ovat ES6:ssa tullut "uutuus". Ne määritellään laittamalla parametrit sulkuihin (tai jos vain yksi parametri, niin sulut voi jättää pois), sitten nuoli =>, ja lopuksi funktion palauttama arvo (yhtenä lausekkeena) tai voi laittaa myös lohkon {...}, jossa on return-lause (tai eihän returnia välttämättä tarvitse, jos funktio ei palauta mitään (ts. palauttaa undefined)).
Esim.
x => 2*x
(x, y) => x y
Tässä esimerkki lohkon kanssa
x => {let y = x 1; return x*y;}
Nuolifunktioissa on this-referenssin kannalta sellainen jippo, että ne eivät "tee omaa this:siään" vaan nuolifunktion sisällä this viittaa siihen, mihin se viittaa nuolifunktion ulkopuolella.
Tuossa sinun esimerkissä
"
(diameter) => diameter * 3.14159265;
console.log(diameter)
"
diameteter on tuossa vain parametri, joten se ei ole määritelty nuolifunktion ulkopuolella (missä tuo console.log on). Jos haluat tulostuksen tapahtuvan funkion sisällä, niin käytä lohko-tapaa (lisäksi laitetaan funktio muuttujaan, jotta sitä voi kutsua myöhemmin):
const getPerimeter = diameter => {
console.log(diameter );
return diameter * Math.PI; //pii löytyy Math-kirjastosta
};
getPerimeter(2);Pakko jättää hautumaan, en saanut tästäkään mitään järkevää irti:
x => 2 * x
console.log(x)
Virhettä pukkaa vaan:
VM170:2 Uncaught ReferenceError: x is not defined
Ehkä se sitten joskus selviää, kun sen aika tulee. - Anonyymi
Anonyymi kirjoitti:
Pakko jättää hautumaan, en saanut tästäkään mitään järkevää irti:
x => 2 * x
console.log(x)
Virhettä pukkaa vaan:
VM170:2 Uncaught ReferenceError: x is not defined
Ehkä se sitten joskus selviää, kun sen aika tulee.Nuolifunktio on nimetön. Jotta sitä voisi kutsua (jos ei tee heti-kutsua), niin se pitää tallentaa muuttujaan. Esimerkissä
x => 2 * x
x on siis parametri, ei funktion nimi. Tehdään näin:
var f = (x => 2*x)
Nyt f on funktio, joka kaksinkertaistaa argumenttinsa. Sulut on yllä selkeyttämässä, ne ei olisi pakolliset, sillä lauseke "x => 2*x" suoritetaan ensin ja sitten siitä tullut tulos (eli funktio) tallennetaan muuttujaan f. - Anonyymi
Anonyymi kirjoitti:
Nuolifunktio on nimetön. Jotta sitä voisi kutsua (jos ei tee heti-kutsua), niin se pitää tallentaa muuttujaan. Esimerkissä
x => 2 * x
x on siis parametri, ei funktion nimi. Tehdään näin:
var f = (x => 2*x)
Nyt f on funktio, joka kaksinkertaistaa argumenttinsa. Sulut on yllä selkeyttämässä, ne ei olisi pakolliset, sillä lauseke "x => 2*x" suoritetaan ensin ja sitten siitä tullut tulos (eli funktio) tallennetaan muuttujaan f.No näin tavaten sain jotain irti. Ymmärsin asian niin että nämä kaksi vastaavat täysin toisiaan, toinen on vain lyhyempi kirjoittaa:
Lyhyt muoto:
var f = (x => 2 * x);
Pitkä muoto:
var f = new Function("x", "return 2 * x");
Kumpaakin kutsutaan kehitystyökalujen, "Console" -välilehdellä näin kun halutaan vastaus; paljonko on 10 * 10:
console.log( f(10) );
- Anonyymi
Taas törmäsin outoihin asioihin, tässä 5 "kyselyä" jotka palauttavat arvon "TRUE", siitäkin huolimatta, että tämä kyseinen HTML -dokumentti on täysin tyhjä.
alert( document.body instanceof EventTarget ); //true
alert( document.body instanceof Node ); //true
alert( document.body instanceof Element ); //true
alert( document.body instanceof HTMLElement ); //true
alert( document.body instanceof HTMLBodyElement ); //true
Vieläkö jaksat opastaa. Nyt nimittäin päätin perehtyä näihin HTML -elementtien paikallistamisiin, muutoksien tekemisiin, ja uusien elementtien lisäämisiin ja sijoittamisiin HTML -dokumenttiin. On ehken se mielenkiintoisin asia koko touhussa.- Anonyymi
Hmmm... Siellä ilmeisesti on kuitenkin body. Pääset tutkimaan DOM:n rakennetta kehitystyökalujen (F12) Elements-välilehdellä (ainakin Chromessa). Siellä voi valita Elementin ja poistaa sen painamalla Del.
JavaScriptillä body:n voisi poistaa näin
document.body.parentElement.removeChild(document.body);
//Toinen tapa. Documentin lapsi on html ja sillä lapsi body.
document.children[0].removeChild(document.body);
//Poistetaanpa koko html:
document.removeChild(document.children[0]);
//Nyt documentti on ainain tyhjä!
W3schools on aika hyvä tietopankki noihin asioihin (jos et ole jo törmännytkin, se on googlehauissa aika suosittu)
https://www.w3schools.com/jsref/prop_doc_body.asp - Anonyymi
Anonyymi kirjoitti:
Hmmm... Siellä ilmeisesti on kuitenkin body. Pääset tutkimaan DOM:n rakennetta kehitystyökalujen (F12) Elements-välilehdellä (ainakin Chromessa). Siellä voi valita Elementin ja poistaa sen painamalla Del.
JavaScriptillä body:n voisi poistaa näin
document.body.parentElement.removeChild(document.body);
//Toinen tapa. Documentin lapsi on html ja sillä lapsi body.
document.children[0].removeChild(document.body);
//Poistetaanpa koko html:
document.removeChild(document.children[0]);
//Nyt documentti on ainain tyhjä!
W3schools on aika hyvä tietopankki noihin asioihin (jos et ole jo törmännytkin, se on googlehauissa aika suosittu)
https://www.w3schools.com/jsref/prop_doc_body.aspKun tein tyhjän tiedoston, jolla on vain nimi, ja sitten siihen kohdistin tuon kyselyn, kaikkiin tuli TRUE vastaus. Sehän tässä hämmensi, että ei voi olla kysymys, tuosta juuri tekemästäni tyhjästä tiedostosta.
No nyt poistin nuo kaikki tuolla; document.removeChild(document.children[0]); komennolla, ja ajoin saman uudestaan, no nyt tulikin kaikkiin vastaus FALSE, mutta kun painoin F5 kaikki palasi ennalleen.
Joten ehkä tämä selaimen "Console", ei vaan hyväksy sellaista tilannetta, ettei olisi HTML -dokumentin "pakolliset" elementit olemassa. No oli miten oli tämä asia selvisi tällä, jatketaan, katsotaan missä seuraavaksi kompuroin. - Anonyymi
Anonyymi kirjoitti:
Kun tein tyhjän tiedoston, jolla on vain nimi, ja sitten siihen kohdistin tuon kyselyn, kaikkiin tuli TRUE vastaus. Sehän tässä hämmensi, että ei voi olla kysymys, tuosta juuri tekemästäni tyhjästä tiedostosta.
No nyt poistin nuo kaikki tuolla; document.removeChild(document.children[0]); komennolla, ja ajoin saman uudestaan, no nyt tulikin kaikkiin vastaus FALSE, mutta kun painoin F5 kaikki palasi ennalleen.
Joten ehkä tämä selaimen "Console", ei vaan hyväksy sellaista tilannetta, ettei olisi HTML -dokumentin "pakolliset" elementit olemassa. No oli miten oli tämä asia selvisi tällä, jatketaan, katsotaan missä seuraavaksi kompuroin.Jäi sanomatta tuosta https://www.w3schools.com/js/js_operators.asp sivusta jolla noita operaattoreita käsitellään. Kun katsot mitä sanotaan JavaScript Assignment Operators (
JavaScript sijoitusoperaattorit ), niin eikö ne operaattorit olekin väärin päin,
esimerkiksi:
( =) tulisi olla (= )
pukkaa virheitä, jos noita uskoo. - Anonyymi
Anonyymi kirjoitti:
Jäi sanomatta tuosta https://www.w3schools.com/js/js_operators.asp sivusta jolla noita operaattoreita käsitellään. Kun katsot mitä sanotaan JavaScript Assignment Operators (
JavaScript sijoitusoperaattorit ), niin eikö ne operaattorit olekin väärin päin,
esimerkiksi:
( =) tulisi olla (= )
pukkaa virheitä, jos noita uskoo.= on kyllä oikein. Se siis tarkoittaa, että (jo olemassa olevaa!) muuttujaa kasvatetaan sillä mitä oikealla puolella on. Esim.
var x = 1;
x = 1;
console.log(x);
//x == 2;
- Anonyymi
Ei tuota pitkälle kerinnyt päästä, kun jo apu olisi tarpeen.
Tässä esimerkissä on kaksi DIV -lohkoa, joissa molemmissa on samalla luokkanimellä olevat lapsi DIV elementit. Tarkoitus olisi vain <div class="eka"> lohkon sisältä löytyvän <div class="kaksi"> lohkon värin muuttaa.
https://pastebin.com/7AJ6AzdY
Olen yrittänyt löytää ratkaisun näin ja sadalla muulla tavalla:
var taks = document.getElementsByClassName("eka")[0];
if (taks.childNodes.className == "yksi") {
console.log(taks);
document.getElementsByClassName("kaksi").style.color = "blue";
}
En löytänyt esimerkkejä näistä sisäkkäisistä ClassName luokista, jotain childNodes ohjeita löytyi, mutta vain sille ensimmäiselle elementille, vaikka en saanut niitäkään toimimaan. Vieläkö viitsisit pistää ohjetta?- Anonyymi
Document.querySelector (tai -All, niin löytyy kaikki) on tuohon passeli. Sille annetaan valitsin merkkijono samaan tyyliin kuin mitä CSS-valitsimet ovat. Tässä esimerkki, jossa laitoin tuon vaihdon napin taakse eli koodi löytyy JS-lootasta riviltä 2 eteen päin:
https://jsfiddle.net/8awhg2bs/
Jos CSS-valitseminen ei ole tuttua niin piste tarkoittaa, että elementillä pitää olla tietty luokka ja väli tarkoittaa että nyt mennään lapsi elementtiin.
Tehtävä:
Muuta toiminta siten, että aina kun nappia painaa, sininen tausta hyppää seuraavaan diviin ja kiertää taas alkuun, kun kaikki on kierretty (oletetaan, että divejä olisi nyt vaikka ["eka", "toka", "kolmas"] tai voisihan sitä aluksi etsiä kaikki divit, joilla on lapsina div, jolla on luokka "yksi" ja jolla on lapsi div, jolla taas luokka "kaksi"). - Anonyymi
Anonyymi kirjoitti:
Document.querySelector (tai -All, niin löytyy kaikki) on tuohon passeli. Sille annetaan valitsin merkkijono samaan tyyliin kuin mitä CSS-valitsimet ovat. Tässä esimerkki, jossa laitoin tuon vaihdon napin taakse eli koodi löytyy JS-lootasta riviltä 2 eteen päin:
https://jsfiddle.net/8awhg2bs/
Jos CSS-valitseminen ei ole tuttua niin piste tarkoittaa, että elementillä pitää olla tietty luokka ja väli tarkoittaa että nyt mennään lapsi elementtiin.
Tehtävä:
Muuta toiminta siten, että aina kun nappia painaa, sininen tausta hyppää seuraavaan diviin ja kiertää taas alkuun, kun kaikki on kierretty (oletetaan, että divejä olisi nyt vaikka ["eka", "toka", "kolmas"] tai voisihan sitä aluksi etsiä kaikki divit, joilla on lapsina div, jolla on luokka "yksi" ja jolla on lapsi div, jolla taas luokka "kaksi").Vaikuttaa erinomaisen kätevältä ja helposti sovellettavalta, hyvä. Perehdyn soveltamiseen paremmin.
Ketjusta on poistettu 1 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
- 4024075
Miksi suomalaisia vainajia säilytetään kylmäkonteissa ulkona? Näin kuolleita kohdellaan Suomessa
Suomesta ei löydy enää tilaa kuolleille. Tänä päivänä vainajia säilytetään ympäri maata ulkona kylmäkonteissa. Kontit2252024Olen ärtynyt koska
minulla on tunteita sinua kohtaan. Tunteita joita en voi ilmaista. Kaipaan kaikkea sinussa. Siksi olen välillä hankala.681510Suomalaiset marjat loppuvat
Suomalaiset marjat mätänevät metsään, koska ulkomaalaiset, lähinnä thaimaalaiset poimijat ovat huolehtineet suomalaisten1551345Joku tukeva täti syyttää suomalaisia rasisteiksi Hesarissa
”Kaikki valkoiset ihmiset Suomessa ovat kasvaneet rasistiseen ajatteluun”, sanoo Maija Laura Kauhanen: https://www.hs.1671001Yhteiskuntaa hyväksi käyttäjät
Kyllä täällä Suomussalmellakin osaavat käyttää näitä Suomen etuja hyväksi. Vuokrataan ns. asunto lapselle että saa asu61993Mitä teen väärin?
Alkaa pikku hiljaa tympäsemään ainainen pakkien saanti. Eka ennen kun nähdään, miehet ovat kiinnostuneita viestittelemää125947- 117913
Haluaisin tietää
mikä saa sinut tuntemaan olosi rakastetuksi. Ja sitten haluaisin mahdollisuuden tehdä juuri niin. 💔51888Oli mukava tavata irl
Sattuma toi sinut matkani varrelle. Ihmettelin sitä silloin, ehkä vähän vieläkin. Oli ilo jutella ja tuntea, vaikka nyt24869