关于前端的实操试题

2023-12-25 06:04:57

HTML

  1. 创建一个简单的HTML文档结构：

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My HTML Page</title>
</head>
<body>
    <h1>Hello, World!</h1>
    <p>This is a simple HTML page.</p>
</body>
</html>

  2. 创建一个表单：

    <form>
    <label for="username">Username:</label>
    <input type="text" id="username" name="username" required>
    
    <label for="password">Password:</label>
    <input type="password" id="password" name="password" required>

    <input type="submit" value="Login">
</form>

CSS

  1. 添加样式到HTML文档： 
    <style>
    body {
        font-family: Arial, sans-serif;
        background-color: #f4f4f4;
    }

    h1 {
        color: #333;
    }

    p {
        font-size: 16px;
        line-height: 1.5;
    }
</style>

    JavaScript

  1. 简单的事件处理：

    <button id="myButton">Click me</button>

<script>
    document.getElementById('myButton').addEventListener('click', function() {
        alert('Button clicked!');
    });
</script>

  2. 操作DOM元素：

    <div id="myDiv">This is a div.</div>

<script>
    var myDiv = document.getElementById('myDiv');
    myDiv.innerHTML = 'Content changed!';
    myDiv.style.color = 'blue';
</script>

文章来源:https://blog.csdn.net/weixin_59383576/article/details/135189144
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。