DOM-Elemente finden
var list = document.getElementsByTagName("UL")[0];
var elem = document.getElementById("xyz");
Einbindung in HTML
<button onclick="myFunction()">Click me</button>
<p onclick="myFunction()">Click me to change my text color.</p>
<script>
function myFunction() {
document.getElementById("demo").style.color = "red";
}
<button onclick="myFunction()">Copy Text</button>
<script>
function myFunction() {
document.getElementById("text2").value = document.getElementById("text2").value;
document.getElementById("textarea2").innerHTML = document.getElementById("textarea2").innerHTML;
var field = document.getElementById("field1");
field.style.visibility = field.style.visibility == "hidden" ? "visible" : "hidden";
}
</script>
Methoden
var hypotenuse = function(a,b) { return Math.sqrt(a*a+b*b); }
console.log(hypotenuse(1, 44));
var addAll = function(){
var rc=0;
for (var ix=0; ix < arguments.length; ix++)
rc += arguments[ix];
return rc;
}
addAll(1, 2, 3) === 6;
Strikte Gleichheit
- a == b: Referenzvergleich
- a === b: Inhaltsvergleich
Typen
String
text += ".";
"xyz".substr(1, 2) === "y";
"abc".indexOf("bc") === 1;
"abcb".replace("b", "x") === "axcb";
Numbers
- Nur Gleitpunktzahlen werden benutzt.
- Daher haben Ganzzahlen max. 53 Bit
- x=Math.min(1,2,3); r=Math.floor(x); w=Math.sqrt(x);
- var undef = NaN;
- isNaN(1/0) === true;
- y = parseInt("123");
- str = 123.toString();
Datum
var now = new Date();
var x = new Date(2018, 0, 3, 22, 33, 44, 117);
/// !!! Monat ab 0 gezählt!!!
var year33Since1970 = new Date(24*3600*365.25 * 33);
var z = new Date("2017-3-8T16:31:10.117");
2017 === z.getFullYear();
2===z.getMonth();
8===z.getDate();
16===z.getHours(); 31==z.getMinutes(); 10===z.getSeconds(); 117===z.getMilliseconds();
z.setHours(3); z.setMinutes(9); z.setSeconds(33); z.setMilliseconds(118);
var utc = new Date(Date.UTC(2018, 4, 6));
var millisSince1970 = utc.getTime();
Dictionary
var x = { "zahl" : 33, "pair" : { "x" : true } };
Arrays
a=[1, 2, "wow"];
a0=a.shift(); a === [2, "wow"];
a.push(99); a === [2, "wow", 99];
a.concat([2, 3]) === [2, "wow", 99, 2, 3];
[1, 3, 5, 9].slice(0,2) === [1, 3] && [1, 3, 5, 9].slice(2,3) === [3];
[3, 9, 12].join(" ") === "3 9 12";
Klassen
'use strict';
class Polygon {
constructor(height, width) {
this.name = 'Polygon';
this.height = height;
this.width = width;
}
sayName() {
ChromeSamples.log('Hi, I am a ', this.name + '.');
}
sayHistory() {
ChromeSamples.log('"Polygon" is derived from the Greek polus (many) ' +
'and gonia (angle).');
}
static className() {
return "Polygon";
}
}
const p = new Polygon(300, 400);
p.sayName();