Az 1. v a 2. kód a hatékonyabb és/vagy gyorsabb és miért?
1.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display a random number between 1 and 100.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("demo")
x.innerHTML = Math.floor((Math.random() * 100) + 1);
}
</script>
</body>
</html>
2.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display a random number between 1 and 10.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = Math.floor((Math.random() * 100) + 1);
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
válasza:
válasza:Nincs értelme hatékonyságról beszélni.
Egyébként mind a két kód rossz, mert az x borzasztó semmitmondó változónév, de akkor már a második esetben kevésbé rosszabb, ahol csak egy véletlen számot tárolsz benne és nem egy html elemet.
válasza:Hatékonyság szempontból ekvivalensek. Mindkettőben ugyanaz van, csak más sorrendben: 2 értékadás, 1 random, 1 getElementById. Fölösleges összehasonlítani.
A gyorsaságát le tudod mérni JS-ben. Kérd le a rendszeridőt mikroszekundum pontossággal a függvény elején és végén, majd írasd ki a különbséget.
válasza:Nem lenne elég így:
document.getElementById("demo").innerHTML = Math.floor((Math.random() * 100) + 1);
válasza:1. A document.getElementById("demo")-t akkor érdemes külön változóban tárolni, ha azt többször is felhasználod.
2. Érdemes a Javascript "diszkrét" használatának elsajátítása.
Tehát e helyett:
<button onclick="myFunction()">Try it</button>
inkább adni a gombnak egy azonosítót:
<button id="getRandom">Try it</button>
majd a szkriptben lehet hivatkozni a gombra - például így:
document.getElementById('getRandom').addEventListener('click', myFunction);
Itt egy példa:
3. Marginális megjegyzés: ámbátor a topiknyitó kérdésben szereplő kód láthatólag egy példa, de azért <head> és azon belül a <title> elemeket ne felejtsük el. ;)
Nagyon informatív válasz volt köszi. Egyébiránt...igen csak példaként voltak kitéve a w3schools-on láttam ezt a két kódot, így kíváncsi voltam melyik lehet hatékonyabb, mint mondanak rá a tapasztaltak.
A head és title elhagyását, ha jól rémlik a szintén a w3schools írta, hogy elhagyható a head nemhogy a title szóval érdekelne miért mondtad.
válasza:Mert ha megadsz egy szimpla, <head> és <title> nélküli oldalt a W3C validátorának
https://validator.w3.org/
az alábbi hibaüzenettel fogad:
"Error: Element head is missing a required instance of child element title.
From line 2, column 7; to line 3, column 6
ml>↩<html>↩<body>↩↩<h1>
Content model for element head:
If the document is an iframe srcdoc document or if title information is available from a higher-level protocol: Zero or more elements of metadata content, of which no more than one is a title element and no more than one is a base element.
Otherwise: One or more elements of metadata content, of which exactly one is a title element and no more than one is a base element. "
A <title> tag leírásánál szerepel is:
"The <title> tag is required in all HTML documents and it defines the title of the document.
...
Tip: If you omit the <title> tag, the document will not validate as HTML."
http://www.w3schools.com/tags/tag_title.asp
Bizonyos esetekben - például HTML-alapú emaileknél, <iframe> tagbe illesztett tartalomnál (ahol a szülődokumentum tartalmaz már ilyesmit) - elhagyható:
"The title element is a required child in most situations, but when a higher-level protocol provides title information, e.g. in the Subject line of an e-mail when HTML is used as an e-mail authoring format, the title element can be omitted."
https://www.w3.org/TR/html5/document-metadata.html#the-head-element
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!