Skip to content

Instantly share code, notes, and snippets.

@silviudobrica

silviudobrica/index.html

Created September 9, 2019 09:25
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save silviudobrica/24e4955d31fc86f4dc62402ebb34ba6b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save silviudobrica/24e4955d31fc86f4dc62402ebb34ba6b to your computer and use it in GitHub Desktop.
Download ZIP
My 9999th HTML // source https://jsbin.com/lajohokezo
Raw
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My 9999th HTML</title>
</head>
<body>
<h1>Hello Romania!</h1>
<p>Primul paragraf</p>
<p>Al doilea paragraf</p>
<p>Al treilea paragraf</p>
<div>
Vreau sa apas ceva:
<button>Apasa!!</button>
</div>
<script id="jsbin-javascript">
function generateRandomColor() {
function dec2hex(digit) {
switch(digit) {
case 10:
return 'A';
case 11:
return 'B';
case 12:
return 'C';
case 13:
return 'D';
case 14:
return 'E';
case 15:
return 'F';
default:
return String(digit);
}
}
let string = '#';
for (let i = 0; i < 6; i++) {
const number = Math.floor(Math.random() * 16); // [0 - 16)
const hexa = dec2hex(number);
string += hexa;
}
return string;
}
const button = document.querySelector('button');
function changeText() {
button.style.backgroundColor = generateRandomColor();
}
button.onclick = changeText;
function changeColor() {
button.style.color = generateRandomColor();
}
button.onmouseover = changeColor;
// Select Header (only one element)
const header = document.querySelector('h1');
// Select Paragraphs (ALL of them)
const paragraphs = document.querySelectorAll('p');
// Read header content
console.log(header.innerText)
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// read one paragraph content
console.log(element.innerText);
}
// for (let index in paragraphs) {
// console.log(paragraphs[index].innerText);
// }
// Modify header content
header.innerText = 'New header';
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// modify one paragraph content
element.innerText += ' e tarziu...';
}
</script>
<script id="jsbin-source-html" type="text/html"><!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My 9999th HTML</title>
</head>
<body>
<h1>Hello Romania!</h1>
<p>Primul paragraf</p>
<p>Al doilea paragraf</p>
<p>Al treilea paragraf</p>
<div>
Vreau sa apas ceva:
<button>Apasa!!</button>
</div>
</body>
</html>
</script>
<script id="jsbin-source-javascript" type="text/javascript">function generateRandomColor() {
function dec2hex(digit) {
switch(digit) {
case 10:
return 'A';
case 11:
return 'B';
case 12:
return 'C';
case 13:
return 'D';
case 14:
return 'E';
case 15:
return 'F';
default:
return String(digit);
}
}
let string = '#';
for (let i = 0; i < 6; i++) {
const number = Math.floor(Math.random() * 16); // [0 - 16)
const hexa = dec2hex(number);
string += hexa;
}
return string;
}
const button = document.querySelector('button');
function changeText() {
button.style.backgroundColor = generateRandomColor();
}
button.onclick = changeText;
function changeColor() {
button.style.color = generateRandomColor();
}
button.onmouseover = changeColor;
// Select Header (only one element)
const header = document.querySelector('h1');
// Select Paragraphs (ALL of them)
const paragraphs = document.querySelectorAll('p');
// Read header content
console.log(header.innerText)
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// read one paragraph content
console.log(element.innerText);
}
// for (let index in paragraphs) {
// console.log(paragraphs[index].innerText);
// }
// Modify header content
header.innerText = 'New header';
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// modify one paragraph content
element.innerText += ' e tarziu...';
}</script></body>
</html>
Raw
jsbin.lajohokezo.js
function generateRandomColor() {
function dec2hex(digit) {
switch(digit) {
case 10:
return 'A';
case 11:
return 'B';
case 12:
return 'C';
case 13:
return 'D';
case 14:
return 'E';
case 15:
return 'F';
default:
return String(digit);
}
}
let string = '#';
for (let i = 0; i < 6; i++) {
const number = Math.floor(Math.random() * 16); // [0 - 16)
const hexa = dec2hex(number);
string += hexa;
}
return string;
}
const button = document.querySelector('button');
function changeText() {
button.style.backgroundColor = generateRandomColor();
}
button.onclick = changeText;
function changeColor() {
button.style.color = generateRandomColor();
}
button.onmouseover = changeColor;
// Select Header (only one element)
const header = document.querySelector('h1');
// Select Paragraphs (ALL of them)
const paragraphs = document.querySelectorAll('p');
// Read header content
console.log(header.innerText)
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// read one paragraph content
console.log(element.innerText);
}
// for (let index in paragraphs) {
// console.log(paragraphs[index].innerText);
// }
// Modify header content
header.innerText = 'New header';
// Iterate ALL of paragraphs
for (let element of paragraphs) {
// modify one paragraph content
element.innerText += ' e tarziu...';
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment