Jayden's Blog

关于面向对象编程

Posted on 2021-07-14 In Java Word count in article: 3.7k Reading time ≈ 3 mins.

暑假预习Java，这里总结下面向对象中Java和C++一些不一样的地方

`super();`

class person {
    protected int age;

    public person(int age) {
        this.age = age;
    }
}

class student extends person {
    protected int score;

    public student(int age,int score) {
        //super(age);
        this.score = score;
    }
}

如果没有使用super，会得到一个编译错误，在student的构造方法中，无法调用person的构造方法

在java里，任何class的构造方法，第一行必须调用父类的构造方法，如果没有明确地调用父类的构造方法，编译器会自动加一句super();，but，这个super里没有参数，父类里没有无参数的构造方法，故编译失败，因此，需要把注释去掉，加上正确的super语句

阻止继承

官方版

aa.java

public final class aa{/* code */}

用final来修饰指定类

基于css的一些动画

Posted on 2021-07-08 In FrontEnd Word count in article: 9.7k Reading time ≈ 9 mins.

一些css动画的整理

js轮播图改进版

Posted on 2021-06-21 In FrontEnd Word count in article: 7.1k Reading time ≈ 6 mins.

实现一个基于JavaScript的轮播图效果

网页的注册、登录、拦截

Posted on 2021-06-20 In FrontEnd Word count in article: 9.4k Reading time ≈ 9 mins.

本次作业是简单实现网页的注册、登录、拦截

注册部分

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="reg.css">
    <script src="fun.js"></script>    
</head>
<body>
    <table align="center" cellpadding="5px">
        <tr>
            <td>&nbsp;</td>
            <td align="left">register</td>
        </tr>
        <tr>
            <td align="right">username:</td>
            <td>
                <input type="text" id="username" autocomplete="off" placeholder="enter your name">
            </td>
        </tr>
        <tr>
            <td align="right">password</td>
            <td>
                <input type="password" id="password" placeholder="enter your password">
            </td>
        </tr>
        <tr>
            <td align="right">confirm password</td>
            <td>
                <input type="password" id="repwd" placeholder="confirm your password">
            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>
                <input type="button" value="register" id="register" onclick="reg()">
                <a href="login.html">login</a>
            </td>
        </tr>
    </table>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="reg.css">
    <script src="fun.js"></script>    
</head>
<body>
    <table align="center" cellpadding="5px">
        <tr>
            <td>&nbsp;</td>
            <td align="left">register</td>
        </tr>
        <tr>
            <td align="right">username:</td>
            <td>
                <input type="text" id="username" autocomplete="off" placeholder="enter your name">
            </td>
        </tr>
        <tr>
            <td align="right">password</td>
            <td>
                <input type="password" id="password" placeholder="enter your password">
            </td>
        </tr>
        <tr>
            <td align="right">confirm password</td>
            <td>
                <input type="password" id="repwd" placeholder="confirm your password">
            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>
                <input type="button" value="register" id="register" onclick="reg()">
                <a href="login.html">login</a>
            </td>
        </tr>
    </table>
</body>
</html>

css

*{
    font-size: 18px;
}
table{
    margin-top: 150px;
}
tr{
    height: 50px;
}
a{
    text-decoration: none;
}
#register{
    background-color: gray;
    border-radius: 10px;
    box-shadow: 1px 1px 2px 2px #232;
}
#username{
    background-image: url(img/user.JPG);
    background-repeat: no-repeat;
    background-position-x: 5px;
    background-position-y: 5px;
    /* 设置背景图,也就是那个用户名头像的位置 */
    height: 30px;
    padding-left: 35px;
    border: 1px solid gray;
    outline: none;
}
#username:hover{
    border: 1px solid purple;
}
#password,#repwd{
    background-image: url(img/password.JPG);
    background-repeat: no-repeat;
    background-position-x: 5px;
    background-position-y: 5px;
    height: 30px;
    padding-left: 35px;
    border: 1px solid gray;
    outline: none;
}
#password:hover,#repwd:hover{
    border: 1px solid purple;
}

js

function reg() {
    var username = document.getElementById("username").value;
    var pwd = document.getElementById("password").value;
    var repwd = document.getElementById("repwd").value;
    if (username == '') {
        alert("username can't be empty");
        return false;
    }
    if (pwd != repwd) {
        alert("passwords aren't the same");
        return false;
    }
    if (pwd == '' || repwd == '') {
        alert("password can't be empty");
        return false;
    }
    localStorage.setItem("username", username);
    localStorage.setItem("password", pwd);
    // 在浏览器本地添加数据
    alert("register successful");
    window.location.href = "login.html";
    // 跳转到指定界面
}