Gyorsabb a HTML fájlban body végén szereplő javascipt kód betöltési sebessége, mintha külön fájlba tenném?
válasza:Igen, de nagyon lassan tölt be az oldalam. Eddig is próbáltam darabokra szedni a kódot úgy, hogy bizonyos eseményekre csatolja hozzá a HTML kódhoz azt a script tag-et, ami hivatkozik a js fájlra.
Lehet hogy a használt ingyenes FTP szerverről való letöltés is beleszámít?
válasza:Érdemesebb külön állományba rakni, mert áttekinthetőbbé teszi a HTML-kódot.
Másrészt érdemes a </body> tag előtt meghívni - és ehhez illik a Javascript kódot "diszkrétté" alakítani ( [link] ) - mert így először betölti és megjeleníti a HTML-oldalt, majd kiegészíti a Javascript-betétekkel.
"Lehet hogy a használt ingyenes FTP szerverről való letöltés is beleszámít?"
Pontosabban a webszerverről való letöltés sebessége - de még befolyásolja a webszerver beállítása (rendes cache-kezelés, GZIp tömörítés használata, stb...).
Nem mellesleg ha nem vagyunk indiszkrétek, és publikus a dolog: láthatnánk a kérdéses oldalt?
válasza:Itt azt írja, hogy gyorsabb:
"It is a good idea to place scripts at the bottom of the <body> element.
This improves page load, because HTML loading is not blocked by scripts loading."
Innen vettem az ötletet, hogy lentre jobb.
Kérlek ne kövezzetek meg miután ránéztek az oldalra, van programozási tapasztalatom, OOP szemléletetből is kapizsgálok valamit, kb. ennyi fért bele 2-3 hét w3schools tanulmányozás után:
Itt pedig a próba js szétszedéses változata: [link] proba/
Nővérem vetette fel, hogy jó lenne egy weblap a képeire, így elvállaltam.
A weboldal egyszerre tölti le az összes menü tartalmát, így "designosabb" a köztük való lépegetés :)
Még arra gondolok, hogy az ikonképeket is akkor töltse le, ha rámegyek a galéria menüre, ne rögtön weblap betöltésekor.
Ha mailt szeretnétek próbálni a proba-n ha kérhetlek.
válasza:"Innen vettem az ötletet, hogy lentre jobb. "
Csak annyit ír, mint én is mondtam (illetve más oldalakon is írják - például: https://developer.yahoo.com/performance/rules.html#js_bottom ) hogy a <body> tag lezárása elé rakva jobb (a jqueryt rakd le). Azt nem írja, hogy beágyazott szkriptként, vagy külön állományban-e a jobb.
Szerény véleményem szerint egyébként szedd szét az oldalt külön HTML-lapokra - tehát legyen külön a Főoldalnak, az Önéletrajznak, a Galériának, a Kiállításoknak, illetve a Kapcsolatnak; mindegyikben szerepeljen a felső "banner" illetve a menüsáv is. A menüből szimplán horgonyokkal (<a> tag) lehessen navigálni a többi oldalra.
Hogy kihasználjuk a Javascript adta lehetőségeket az alábbit javaslom - tegyük fel, hogy van az alábbi struktúra:
<ul id="nav">
<li><a class="current" href="index.html">Főoldal</a></li>
<li><a href="oneletrajz.html">Önéletrajz</a></li>
<li><a href="galeria.html">Galéria</a></li>
<li><a href="kiallitasok.html">Kiállítások</a></li>
<li"><a href="kapcsolat.html">Kapcsolat</a></li>
</ul>
<div id="wrapper">
<div id="content">
<p id="udv"><br>Kedves látogató!<br>Szeretettel üdvözöllek az oldalamon!</p>
</div>
</div>
akkor JQuery használatával az alábbi trükk használható:
$(document).ready(function() {
$('#nav li a').click(function() {
$('#nav li a').removeClass('current');
$(this).addClass('current');
$( '#content' ).load( $(this).attr('href')+' #content' );
return false;
});
});
Így nem lesz annyira tolakodó a Javascript, nélküle is használható lesz az oldal.
Csak hogy fel tudjam dolgozni mit is írtál:
1: addClass művelet: ha rákattintott menügombot szinezi,a removeClass meg az aktuális kijelölését szüneteti?
2: a (#content).load betölti a másik html fájlban található #content tartalmát, az aktuális helyére?
3: a fentiek végrehajtása hogyan lehetséges, ha lefut az <a> tag-ben található href hivatkozás ami mutat másik html fájlra, így újratöltve a js tartalmát (mert gondolom mindegyik head-je tartalmazza a <script src=".js"></script> tag-eket)?
Elnézést, ha teljesen máshogy látom azt amire gondoltál, csak szükségem lenne egy kis magyarázatra.
válasza:"1: addClass művelet: ha rákattintott menügombot szinezi,a removeClass meg az aktuális kijelölését szüneteti? "
A példában a Főoldal menüpontnak van current osztálya, tehát ha a current osztályban be van állítva a "színezés", akkor az lesz színezve.
Ha rákattintasz teszem azt a Galéria menüpontra, akkor a Főoldal menüpontról eltűnik (removeClass) a current osztály, így megszűnik a színezése és rákerül (addClass) a Galéria menüpontéra, így színezve lesz.
Hasonló kialakítható az egérrel való rámozduláskor (mouseover) is, csak ott meg kell hagyni az eredeti menüponton (esetünkben a Főoldal) az osztályt és az aktuálisan kiválasztottra (példánkban a Galéria) meg rárakni, amit az egérrel való elmozduláskor (mouseout) el lehet távolítani.
"2: a (#content).load betölti a másik html fájlban található #content tartalmát, az aktuális helyére? "
Úgy van, lásd: [link]
"3: a fentiek végrehajtása hogyan lehetséges, ha lefut az <a> tag-ben található href hivatkozás"
Ezért kell a
return false;
a click eseményhez - így nem fog érvényesülni az <a> tag href attribútuma.
Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!