Basic Webpage

Welcome to my basic webpage!

<h2>Features:</h2>
<ul>
    <li><a href="#calculator">Calculator</a></li>
    <li><a href="#counter">Counter</a></li>
    <li><a href="#todo">To-Do List</a></li>
</ul>

<h2 id="calculator">Calculator</h2>
<label for="num1">Number 1:</label>
<input type="number" id="num1" name="num1">
<br>
<label for="num2">Number 2:</label>
<input type="number" id="num2" name="num2">
<br>
<button onclick="calculate()">Add</button>
<p id="result"></p>

<h2 id="counter">Counter</h2>
<button onclick="increment()">Increment</button>
<button onclick="decrement()">Decrement</button>
<p id="count">0</p>

<h2 id="todo">To-Do List</h2>
<input type="text" id="task" name="task">
<button onclick="addTask()">Add Task</button>
<ul id="taskList"></ul>

<script>
    function calculate() {
        var num1 = parseInt(document.getElementById("num1").value);
        var num2 = parseInt(document.getElementById("num2").value);
        var result = num1 + num2;
        document.getElementById("result").innerHTML = "Result: " + result;
    }

    var count = 0;
    function increment() {
        count++;
        document.getElementById("count").innerHTML = count;
    }

    function decrement() {
        count--;
        document.getElementById("count").innerHTML = count;
    }

    function addTask() {
        var task = document.getElementById("task").value;
        var taskItem = document.createElement("li");
        taskItem.innerHTML = task;
        document.getElementById("taskList").appendChild(taskItem);
        document.getElementById("task").value = "";
    }
</script>

原文地址: https://www.cveoy.top/t/topic/hQip 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录