html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
<head>
<title> Adding letters? </title>
<meta charset="utf-8" />
<style>
</style>
</head>
<body>
<div id="container">
<div id="intro">
Adding letter values
</div>
<p id="please"> Please enter your string:
</p>
<input type="text" id="input" />
<button id="butt" onclick="myFunc()"> Add </button>
<button id="clear" onclick="myClear()"> Clear </button>
<div id="output"> Output : </div>
</div>
<script>
</script>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
#intro {
border: 1px solid lightgray;
border-radius:5px;
font-weight:bold;
color:darkgreen;
background-color: #bbeedd;
text-align:center;
margin:10px;
}
#container {
border:1px solid lightgray;
border-radius:5px;
background-color:#bbeecc;
}
p {
border:1px solid lightgray;
border-radius:5px;
text-indent:6px;
font-weight:bold;
color:darkgreen;
margin:5px;
text-align:center;
}
#input {
border:1px solid green;
border-radius:5px;
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function myFunc() {
var a = document.getElementById('input').value;
var b = document.getElementById('output');
var x = 0;
a = a.toLowerCase().replace(/[^a-z]+/g,'');
for(y=0; y<a.length; y++) {
x += (a.charCodeAt(y)-96);
}
b.innerHTML += x;
}
function myClear() {
var a = document.getElementById('input');
var output = document.getElementById('output');
a.value = '';
output.innerHTML = 'Output: ';
}
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run