var num = 5;
var greeting = "Hallo";
var isLogged = true;
var colors = ["Rot", "Grün", "Blau"];
var person = { name: "John", age: 30 };
var emptyValue = null;
var undefinedValue = undefined;
var x = 5;
var y = 3;
var sum = x + y; // 8
var difference = x - y; // 2
var product = x * y; // 15
var quotient = x / y; // 1.6666666666666667
var remainder = x % y; // 2
x += 1; // x ist jetzt 6
y -= 1; // y ist jetzt 2
var isEqual = x == y; // false
var isGreater = x > y; // true
var logicalAnd = (x > 0) && (y < 10); // true
var logicalOr = (x > 0) || (y > 10); // true
var logicalNot = !isGreater; // false
x++; // x ist jetzt 7
y--; // y ist jetzt 1
var colors = ["Rot", "Grün", "Blau"];
console.log(colors[0]); // Rot
console.log(colors[1]); // Grün
colors.push("Gelb");
console.log(colors); // ["Rot", "Grün", "Blau", "Gelb"]
colors.pop();
console.log(colors); // ["Rot", "Grün", "Blau"]
var age = 18;
if (age >= 18) {
console.log("Du bist volljährig.");
} else {
console.log("Du bist minderjährig.");
}
for (var i = 0; i < 5; i++) {
console.log(i);
}
var j = 0;
while (j < 5) {
console.log(j);
j++;
}
var day = "Montag";
switch (day) {
case "Montag":
console.log("Heute ist Montag.");
break;
case "Dienstag":
console.log("Heute ist Dienstag.");
break;
default:
console.log("Ein anderer Tag.");
break;
}
function greet(name) {
console.log("Hallo, " + name + "!");
}
function add(a, b) {
return a + b;
}
greet("John"); // Hallo, John!
var result = add(3, 5); // 8
var person = {
name: "John",
age: 30,
isStudent: true,
greet: function() {
console.log("Hallo, ich bin " + this.name + ".");
}
};
console.log(person.name); // John
console.log(person.age); // 30
person.greet(); // Hallo, ich bin John.
Javascript ist eine Scriptsprache mit der sich das DOM Element einer Website im Browser des Besuchers bearbeiten lässt und Inhalte dynamisch nachgeladen werden können. Javascript hat dabei keinen Zugriff auf das Dateisystem des Benutzers.
Man kann HTML Elemente mit Javascript anhand ihrer "Klasse" oder ihrer "id" ansprechen. (siehe [[css|CSS]])
var div = document.getElementById('id'); // return = html element
div = document.getElementsByClassName('class'); // return = array of html elements
=====XML=====
var domParser = new DOMParser();
var doc = domParser.parseFromString(res['content'], 'text/xml');
var div;
doc.querySelectorAll('item').forEach((item) => {
div = document.createElement('div');
div.innerHTML = '' + item.querySelector('title').textContent + '';
document.getElementById("ajax").appendChild(div);
})
=====JSON=====
var json = JSON.parse(jsonData);
var jsonStr = JSON.stringify(jsonData);
=====AJAX=====
Ajax (Asynchronous Javascript And Xhtml) ist eine Technik wobei Inhalte von einem Server nachgeladen bzw. verändert werden nachdem die HTTP Seite fertig geladen wurde.
function ajaxGet() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if(this.readyState == 4 && this.status == 200) {
document.getElementById("ajax").innerHTML = this.responseText;
}
};
xhttp.open("GET", "ajax.php", true);
xhttp.send();
}
function ajaxPOST() {
var params = "a=1&b=2&c=3";
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if(this.readyState == 4 && this.status == 200) {
document.getElementById("ajax").innerHTML = this.responseText;
}
};
xhttp.open("POST", "ajax.php", true);
xhttp.send(params);
}
function file_get_contents(filename) {
fetch(filename).then((resp) => resp.text()).then(function(data) {
alert(data);
});
}
https://www.mediaevent.de/javascript/ajax-2-xmlhttprequest.html
=====Cookies=====
document.cookie = "username=manuel; expires=Thu, 12 Sep 2019 16:42:45 GMT; path=/";
console.log(document.cookie);
=====Local storage=====
// create an array
var json_arr = {};
json_arr["name1"] = "value1";
json_arr["name2"] = "value2";
json_arr["name3"] = "value3";
// convert to JSON
var json_string = JSON.stringify(json_arr);
// Store
localStorage.setItem("jsondata", json_string);
// Retrieve
document.getElementById("ajax").innerHTML = JSON.stringify(JSON.parse(localStorage.getItem("jsondata")));
=====IndexedDB=====
var request = indexedDB.open("MyFriends");
request.onupgradeneeded = function() {
// The database did not previously exist, so create object stores and indexes.
var db = request.result;
var store = db.createObjectStore("friends", {keyPath: "id"});
var titleIndex = store.createIndex("by_name", "name");
var authorIndex = store.createIndex("by_phone", "phone");
// Populate with initial data.
store.put({name: "Leopold S", phone: "123", id: 1});
store.put({name: "Adam E", phone: "456", id: 2});
store.put({name: "Jango B", phone: "789", id: 3});
};
request.onsuccess = function() {
db = request.result;
};
=====API=====
index.html
Link 1Link 2Link 3hideshow