View difference between Paste ID: 2tJ2x7uN and vW5exWDU
SHOW: | | - or go back to the newest paste.
1
<html>
2
3
<script type="text/javascript" src = "scripts.js">
4
</script>
5
6
<body>
7
 <div id="add-task">
8
     <p>Text</p>
9
     <input />
10
     <button onclick="onButtonClick()">Button</button>
11
 </div>
12
13
 <br>
14
 <button onclick="Clear_all_tasks()">Clear all</button>
15
<br>
16
 <strong>All Tasks:</strong>
17
 <div id="tasks-list-empty" style="display:none">
18
     <br/>
19
     you have no tasks
20
 </div>
21
     <div id="task-list">
22
     <ul>
23
         <li>Hi!</li>
24
         <li>Hello!)</li>
25
     </ul>
26
     </div>
27
28
29
</body>
30
31
</html>
32
33
//---------------------------------------------------------------------------------------------------------------------------------
34
                                                     // scripts.js
35
36
var data = []; //massiv
37
38
 //peremalovka
39
    var redrow = function ()
40
    {
41
        var taskelem= getULList();
42
        taskelem.innerHTML = '';
43
        var li = [];
44
        for (k in data)
45
        {
46
            var task = data[k];
47
            taskelem.innerHTML += '<li>'+task+'</li>';
48
        }
49
        hideEmpty();
50
51
}
52
53
function getULList(){
54
    var taskslistelem = document
55
        .getElementById('task-list')
56
        .getElementsByTagName('ul')[0];
57
    return taskslistelem;
58
}
59
60
function onButtonClick(){
61
    var input = document
62
        .getElementById('add-task')
63
        .getElementsByTagName('input')[0];
64
65
    var value = input.value;
66
    data.push(value);
67
    redrow();
68
69
}
70
71
function Clear_all_tasks(){
72
    var taskslistelem = getULList();
73
    taskslistelem.innerHTML = ' ';
74
    showEmpty();
75
}
76
77
var showEmpty = function () {
78
    var taskListEmptyEl = document.getElementById('tasks-list-empty');
79
    taskListEmptyEl.style.display = '';
80-
    data = [];
80+
81
82
var hideEmpty = function () {
83
    var taskListEmptyEl = document.getElementById('tasks-list-empty');
84
    taskListEmptyEl.style.display = 'none';
85
}