• JAVAEE：采用HTML和JavaScript实现几个基本的页面

    1.实现效果：

    1. <html>
    2.     <title>学生信息确认title>
    3.         <body>
    4.             <Form>
    5.                 用户名:<input type=text id="usename"><br>
    6.                 密码: <input type=password id="userpwd"><br>
    7.                 性别:<input type=radio id="sex" value="man">男
    8.                     <input type=radio id="sex" value="woman">女<br>
    9.                 爱好:<input type=checkbox id="ai1" value="体育">体育
    10.                     <input type=checkbox id="ai2" value="音乐">音乐<br>
    11.                 图片:<input type=file><br>
    12.                 <input type=submit value="提交"><input type=reset value="重填">
    13.             Form>
    14.         body>
    15. html>

    2.实现效果：

    1. <html>
    2. <head>
    3.     <title>弗雷德网上购物中心title>
    4.     <style>
    5.         h1{
    6.             font-weight: bold;
    7.             font-size: 36px;
    8.             text-align: center;
    9.         }
    10.         table {
    11.             width: 100%; 
    12.             margin: 0 auto; 
    13.         }
    14.         th,td {
    15.             border: 1.5px solid black;
    16.             padding: 11px;
    17.             text-align: left;
    18.            
    19.         }
    20.         h4{
    21.             font-weight: normal;
    22.             font-size: 20px;
    23.             text-align: center;
    24.            
    25.         }
    26.         input{
    27.             margin-top: 15px; 
    28.             margin-bottom: 15px; 
    29.         }
    30.     style>
    31.     <h1>欢迎光临弗雷德网上购物中心h1>
    32. head>
    33. <body>
    34.     <Form>
    35.         会员姓名:<input type=text id="vipname"><br>
    36.         会员卡号:<input type=text id="vipcard"> 
    37.         <select id="viptype">
    38.             <option value="normalvip">普通会员option>
    39.             <option value="goldvip">黄金会员option>
    40.             <option value="diamondvip">钻石会员option>
    41.         select><br>
    42.         联系方式:<input type=text id="phone">
    43.         送货地址:<input type=text id="address">
    44.         <h4>
    45.             <text>选择您喜欢的商品text>
    46.         h4>
    47.         <table border="1" >
    48.             <tr>
    49.                 <th>商品名称th>
    50.                 <th>单价th>
    51.                 <th>数量th>
    52.             tr>
    53.             <tr>
    54.                 <td>脑白金td>
    55.                 <td>￥100.00td>
    56.                 <th> th>
    57.             tr>
    58.             <tr>
    59.                 <td>富硒康td>
    60.                 <td>￥150.00td>
    61.                 <th> th>
    62.             tr>
    63.             <tr>
    64.                 <td>葡萄酒td>
    65.                 <td>￥70.00td>
    66.                 <th> th>
    67.             tr>
    68.             <tr> 
    69.                 <td>美国山核桃td>
    70.                 <td>￥50.00/500gtd>
    71.                 <th> th>
    72.             tr>
    73.         table>
    74.         付款方式:<input type=radio id="payway" value="onlinebank">网银
    75.                 <input type=radio id="payway" value="zhifubao">支付宝
    76.                 <input type=radio id="payway" value="lend">贷款<br>
    77.         <input type=submit value="提交订单"><input type=reset value="清空订单">
    78.     Form>
    79. body>
    80.  
    81. html>

    3.实现效果

    1. <html>
    2. <head>
    3.     <title>水果订单title>
    4.     <script>
    5.         function calculate() {
    6.             var applenum = parseInt(document.getElementById("applenum").value);
    7.             var orangenum = parseInt(document.getElementById("orangenum").value);
    8.             var applePrice = 2; 
    9.             var orangePrice = 1; 
    10.             var total = (applenum * applePrice) + (orangenum * orangePrice);
    11.             var totall = total*1.05;
    12.             document.getElementById("result").innerHTML = "总价：" + totall.toFixed(2) + "元";
    13.         }
    14.     script>
    15. head>
    16. <body>
    17.     <h1>水果订单h1>
    18.     <form>
    19.         <label for="applenum">苹果数量：label>
    20.         <input type="number" id="applenum" name="applenum" value="0"><br>
    21.  
    22.         <label for="orangenum">橘子数量：label>
    23.         <input type="number" id="orangenum" name="orangenum" value="0"><br>
    24.  
    25.         <input type="button" value="提交" onclick="calculate()"><br>
    26.  
    27.         <div id="result">div>
    28.     form>
    29. body>
    30. html>

  • 相关阅读:
    OpenCV + sklearnSVM 实现手写数字分割和识别
    SMU可以供电的同时测量电流和电压
    白话 Pulsar Bookkeeper 的存储模型
    今天面了个腾讯拿 38K 出来的，让我见识到了基础的天花板
    MySQL 8.0 Clone 备份恢复演练
    解决ubuntu开机变慢；删除耗时启动项
    catalog database 的配置
    java计算机毕业设计基于ssm的社区失物招领+房屋租赁+停车+宠物互助平台
    年薪高达50W的测开，到底是做什么的？
    SpringBoot整合kafka消费者注解详解
  • 原文地址：https://blog.csdn.net/m0_62102955/article/details/132920497