整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          Javaweb學習(五)JSP技術

          SP技術

          題量: 15 滿分: 100

          作答時間:11-01 22:20至

          重做

          100分

          一. 單選題(共8題,52.8分)

          1.JSP文件在第一次運行的時候被JSP引擎編譯為( )文件

          A. Servlet

          B. Class

          C. HTML

          D. XML

          我的答案: A正確答案: A


          2.page指令的屬性中可以多次設計的屬性是( )

          A. import

          B. session

          C. extends

          D. info

          我的答案: A正確答案: A


          3.在JSP頁面中,能夠完成輸出操作的內置對象是( )

          A. out

          B. response

          C. request

          D. config

          我的答案: A正確答案: A


          4. 在JSP中,若要在JSP正確使用標簽:<x:getKing/>,在jsp中聲明的taglib

          指令為:<%@taglib uri = “/WEB-INF/myTags.tld” prefix = “( )”%>,

          下劃線處應該是

          A. x

          B. getKing

          C. myTags

          D. king

          我的答案: A正確答案: A


          5.某JSP中有如下代碼,顯示結果為( )

          <%

          int a = 5;

          request.setAttribute(“a”,”123”);

          session.setAttribute(“a”,”456”);

          %>

          <c:out value="${a}"/>

          A. 5

          B. 123

          C. 456

          D. null

          我的答案: B正確答案: B


          6.要在jsp中使用ArrayList,做法正確的是( )

          A. <% import java.util.ArrayList%>

          B. <%@ import "java.util.ArrayList"%>

          C. %@ page import="java.util.ArrayList"%>

          D. <%@ page package="java.util.ArrayList"%>

          我的答案: C正確答案: C


          7.下面關于JSP作用域對象的說法錯誤的是( )

          A. request對象可以得到請求中的參數

          B. session對象可以保存用戶信息

          C. application對象可以被多個應用共享

          D. 作用域范圍從小到達是request、session、application

          我的答案: C正確答案: C


          8.在JSP頁面中,保存數據的范圍由小到大依次是( )

          A. pageContext,request,application,session

          B. pageContext,application,session,request

          C. pageContext,request,session,application

          D. pageContext,session,request,application

          我的答案: C正確答案: C




          二. 多選題(共2題,13.2分)

          9.Servlet與JSP的區別是( )

          A. 性能更強

          B. 編程方式不同

          C. 運行速度不同

          D. 編譯順序不同

          我的答案: BCD正確答案: BCD

          10.在a.jsp中有代碼片斷如下:

          <form action =”b.jsp” method =”POST”name=”form1”>

          loginName:<input type=”text”name=”loginName”/>

          <input type=”submit” name=”submit”/>

          </form>

          在b.jsp中加入下列( )代碼,可以輸出在a.jsp頁面上輸入的loginName的值

          A. <%=request.getParameter(“loginName”)%>

          B. <%=request.gerAttribute(“loginName”)%>

          C. <%Stringname=request.getParameter(“loginname”);

          out.println(name); %>

          D. <% Stringname=request.getAttribute(“loginname”);

          out.println(name); %>

          我的答案: AC正確答案: AC



          三. 判斷題(共5題,34分)

          11.JSP頁面是采用JavaScript語言實現在服務端代碼。

          A. 對

          B. 錯

          我的答案: 錯正確答案: 錯


          12<jsp:forward ... >標記的page屬性值是相對的URL地址,只能靜態的URL。

          A. 對

          B. 錯

          我的答案: 錯正確答案: 錯


          13.JSP代碼可以直接執行,所以不會被翻譯成JAVA代碼。

          A. 對

          B. 錯

          我的答案: 錯正確答案: 錯


          14.JSP頁面中不能包含腳本元素。

          A. 對

          B. 錯

          我的答案: 錯正確答案: 錯


          15.JSP中Java表達式的值由服務器負責計算,并將計算值按字符串發送給客戶端顯示。

          A. 對

          B. 錯

          我的答案: 對正確答案: 對

          一、寫在前面

          二、效果圖

          三、實現思路

          四、實現代碼

          1、login總界面

          2、registercheck總代碼

          3、logoutcheck總代碼

          4、amendcheck總代碼


          相關文章

          一、寫在前面

          哈嘍~大家好,這篇呢我們來看看用 JSP 連接 MySQL 登入注冊項目實踐,這里就可能有人問了,唉?追桑~前些天不是寫了 jsp 登入注冊的項目嗎?怎么這次還在寫呢?哈哈,您別擔心,這次呢,肯定和上次不同,我們先來看看效果吧!

          二、效果圖

          數據庫界面

          感覺是不是不一樣了,哈哈哈,那么接下來我們來看看是怎么實現的。

          三、實現思路

          首先我們這里很明顯,有四個總頁面分別是 login(登入界面)、logout(注銷界面)、amend(修改界面)、register(注冊界面),這四個總頁面分別對應著檢查頁面(check)、成功頁面(success)、失敗頁面(fail)。建立之好后,通過 from 的 action 來進行跳轉,我們先來看看 MySQL (數據庫)表名叫 login。

          我們這里數據庫共三列,第一列叫 name (用戶名)、pass(密碼)、time(注冊時間),name 與 pass 都是 int(整型) 類型的,time 是 varchar (可變長類型),如圖。

          四、實現代碼

          1、login總界面

          首先我們先有個頁面,有基本的用戶名框,密碼框,兩按鈕,一個注冊,一個注銷,通過 from進行跳轉,代碼如下

           <form method="post" action="check.jsp">
                  <input type="text" name="user" style="width: 300px;height: 50px" placeholder="請輸入用戶名:"
                  > <br>
                  <input type="password" name="pass" style="width: 300px;height: 50px" placeholder="請輸入密碼:" > <br>
                  <button type="submit" style="width:80px;height:40px; font-size: 20px" class="clear">登錄</button>
                  <button type="reset" style="width:80px;height:40px; font-size: 20px" class="clear">重置</button>
                  <br>
                  沒有賬號?<a href="register.jsp">點擊注冊</a><br>
                  不想用了?<a href="logout.jsp">點擊注銷</a>
              </form>
          

          用 check 連接數據庫(如何連接數據庫,前面文章已經給出了,有興趣的小伙伴可以看看前面寫的文章,也放在前面了) 同樣的道理,還是那五個步驟(這里就不過多的解釋,可以看看上面表格給出的文章),先來看看代碼。

          String user = request.getParameter("user"); // getParameter  與 getAttribute  區別
                  String pass = request.getParameter("pass");
                  // String getParameter(String name):根據參數名稱獲取參數值
                  // getAttribute()獲取的是服務器設置的數據。getAttribute() 方法返回指定屬性名的屬性值。
           
                  try {
                      Class.forName("com.mysql.cj.jdbc.Driver");
                      String url = "jdbc:mysql://localhost:3306/db1?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=UTC";
                      String user1 = "root";
                      String pass1 = "123456";
                      Connection connection = DriverManager.getConnection(url,user1,pass1);
                      String sql = "select * from login where name=? and pass=?";
           
                      PreparedStatement ps = connection.prepareStatement(sql);
                      ps.setString(1,user);
                      ps.setString(2,pass);
                      ResultSet re = ps.executeQuery();
           
                      if (re.next()){
                          response.sendRedirect("loginsuccess.jsp");
                          session.setAttribute("user",user);
                      }else {
                          response.sendRedirect("loginfail.jsp");
                      }
           
                  } catch (ClassNotFoundException e) {
                      e.printStackTrace();
                  } catch (SQLException e) {
                      e.printStackTrace();
                  }
          

          這里 response.sendRedirect 跳轉了兩個頁面一個 loginsuccess 和 loginfail 的兩個界面,下面我們來看看,這兩個文件(其實很簡單)

          loginsuccess 代碼

           <div class="form">
                          <h2> <h22>登錄成功</h22><br>
                          </h2>
                          <fon>恭喜您成功登入 <br>    歡迎使用 <br>
                              <a class="a1" href="login.jsp">返回登入界面</a>
                          </fon>
                      </div>
          

          loginfail 代碼:

          <h2> <h22>登錄失敗</h22><br>
                          </h2>
                          <fon>寶~是不是賬號或密碼記錯惹? <br>
                              <a class="a1" href="login.jsp">返回登入界面</a><br>
                              <p1><a href="amend.jsp">點擊修改密碼</a></p1>
                          </fon>

          這里我們點擊運行看看效果

          這里我們用兩個升級 大裝備(html)(css) 來美化一下我們的頁面,這里我們頁面美化的,用的是這位大佬的頁面(博主名為鍵盤奏鳴曲),大家可以來看看,點擊鏈接

          HTML 代碼

          <%@ page contentType="text/html;charset=UTF-8" language="java" %>

          <head>

          <meta charset="UTF-8">

          <meta name="viewport" content="width=device-width, initial-scale=1.0">

          <link rel="stylesheet" href="css.css">

          <title>123</title>



          </head>

          <body>


          <section>

          <div class="color"></div>

          <div class="color"></div>

          <div class="color"></div>

          <div class="box">

          <div class="circle" style="--x:0"></div>

          <div class="circle" style="--x:1"></div>

          <div class="circle" style="--x:2"></div>

          <div class="circle" style="--x:3"></div>

          <div class="circle" style="--x:4"></div>

          <div class="container">

          <div class="form">

          <h2>登錄</h2>

          <form method="post" action="check.jsp">

          <div class="inputBox">

          <input type="text" placeholder="姓名" name="user">


          </div>

          <div class="inputBox">

          <input type="password" placeholder="密碼" name="pass">


          </div>

          <div class="inputBox">

          <input type="submit" value="登錄">


          </div>

          <p class="forget">不想用了?<a href="logout.jsp">

          點擊這里

          </a></p>

          <p class="forget">沒有賬戶?<a href="register.jsp">

          注冊

          </a></p>

          </form>

          </div>

          </div>

          </div>

          </section>

          </body>


          </html>

          CSS 代碼

          /*.center{*/
          /*    text-align:center;*/
          /*    margin-top: 50px;*/
          /*}*/
          .fon{
              font-size: 40px;
          }
          /*body{*/
          /*    background: url("images/image-2.jpg") no-repeat 0 0;*/
          /*    background-size: 100% 100%;*/
          /*    text-decoration:none;*/
          /*}*/
           
          /*input {*/
          /*    background-color: transparent;*/
          /*    outline: none;*/
          /*    color: black;*/
          /*}*/
          /*.clear{*/
          /*    opacity:0.3;*/
          /*}*/
           
          * {
              margin: 0;
              padding: 0;
              box-sizing: border-box;
          }
           
          /* 使用flex布局,讓內容垂直和水平居中 */
           
          section {
              /* 相對定位 */
              position: relative;
              overflow: hidden;
              display: flex;
              justify-content: center;
              align-items: center;
              min-height: 100vh;
              /* linear-gradient() 函數用于創建一個表示兩種或多種顏色線性漸變的圖片 */
              background: linear-gradient(to bottom, #f1f4f9, #dff1ff);
          }
           
          /* 背景顏色 */
           
          section .color {
              /* 絕對定位 */
              position: absolute;
              /* 使用filter(濾鏡) 屬性,給圖像設置高斯模糊*/
              filter: blur(200px);
          }
           
          /* :nth-child(n) 選擇器匹配父元素中的第 n 個子元素 */
           
          section .color:nth-child(1) {
              top: -350px;
              width: 600px;
              height: 600px;
              background: #ff359b;
          }
           
          section .color:nth-child(2) {
              bottom: -150px;
              left: 100px;
              width: 500px;
              height: 500px;
              background: #fffd87;
          }
           
          section .color:nth-child(3) {
              bottom: 50px;
              right: 100px;
              width: 500px;
              height: 500px;
              background: #00d2ff;
          }
           
          .box {
              position: relative;
          }
           
          /* 背景圓樣式 */
           
          .box .circle {
              position: absolute;
              background: rgba(255, 255, 255, 0.1);
              /* backdrop-filter屬性為一個元素后面區域添加模糊效果 */
              backdrop-filter: blur(5px);
              box-shadow: 0 25px 45px rgba(0, 0, 0, 0.1);
              border: 1px solid rgba(255, 255, 255, 0.5);
              border-right: 1px solid rgba(255, 255, 255, 0.2);
              border-bottom: 1px solid rgba(255, 255, 255, 0.2);
              border-radius: 50%;
              /* 使用filter(濾鏡) 屬性,改變顏色。
              hue-rotate(deg)  給圖像應用色相旋轉
              calc() 函數用于動態計算長度值
              var() 函數調用自定義的CSS屬性值x*/
              filter: hue-rotate(calc(var(--x) * 70deg));
              /* 調用動畫animate,需要10s完成動畫,
              linear表示動畫從頭到尾的速度是相同的,
              infinite指定動畫應該循環播放無限次*/
              animation: animate 10s linear infinite;
              /* 動態計算動畫延遲幾秒播放 */
              animation-delay: calc(var(--x) * -1s);
          }
           
          /* 背景圓動畫 */
           
          @keyframes animate {
              0%, 100% {
                  transform: translateY(-50px);
              }
              50% {
                  transform: translateY(50px);
              }
          }
           
          .box .circle:nth-child(1) {
              top: -50px;
              right: -60px;
              width: 100px;
              height: 100px;
          }
           
          .box .circle:nth-child(2) {
              top: 150px;
              left: -100px;
              width: 120px;
              height: 120px;
              z-index: 2;
          }
           
          .box .circle:nth-child(3) {
              bottom: 50px;
              right: -60px;
              width: 80px;
              height: 80px;
              z-index: 2;
          }
           
          .box .circle:nth-child(4) {
              bottom: -80px;
              left: 100px;
              width: 60px;
              height: 60px;
          }
           
          .box .circle:nth-child(5) {
              top: -80px;
              left: 140px;
              width: 60px;
              height: 60px;
          }
           
          /* 登錄框樣式 */
           
          .container {
              position: relative;
              width: 400px;
              min-height: 400px;
              background: rgba(255, 255, 255, 0.1);
              display: flex;
              justify-content: center;
              align-items: center;
              backdrop-filter: blur(5px);
              box-shadow: 0 25px 45px rgba(0, 0, 0, 0.1);
              border: 1px solid rgba(255, 255, 255, 0.5);
              border-right: 1px solid rgba(255, 255, 255, 0.2);
              border-bottom: 1px solid rgba(255, 255, 255, 0.2);
          }
           
          .form {
              position: relative;
              width: 100%;
              height: 100%;
              padding: 50px;
          }
           
          /* 登錄標題樣式 */
           
          .form h2 {
              text-align: center;
              position: relative;
              color: #fff;
              font-size: 40px;
              font-weight: 600;
              letter-spacing: 5px;
              margin-bottom: 30px;
              cursor: pointer;
          }
           
          .form h2 h22 {
              top: -40px;
              text-align: center;
              position: relative;
              color: #fff;
              font-size: 40px;
              font-weight: 600;
              letter-spacing: 5px;
              margin-bottom: 30px;
              cursor: pointer;
          }
           
          .form .a1, .form p1 {
              bottom: -90px;
              left: 50px;
              position: relative;
              color: #fff;
              font-size: 18px;
              font-weight: 600;
              letter-spacing: 5px;
              /*margin-bottom: 10px;*/
              cursor: pointer;
              text-decoration: none;
          }
           
          .form p1 a{
           
              position: relative;
              color: #fff;
              font-size: 18px;
              font-weight: 600;
              letter-spacing: 5px;
              /*margin-bottom: 10px;*/
              cursor: pointer;
              text-decoration: none;
          }
           
          .form fon {
              top: -30px;
              left: 30px;
              position: relative;
              color: #fff;
              font-size: 28px;
              font-weight: 600;
              letter-spacing: 5px;
              margin-bottom: 30px;
              cursor: pointer;
          }
          /* 登錄標題的下劃線樣式 */
           
          .form h2::before {
              content: "";
              position: absolute;
              left: 0;
              bottom: -10px;
              width: 0px;
              height: 3px;
              background: #fff;
              transition: 0.5s;
          }
           
          .form h2 h22::before {
              content: "";
              position: absolute;
              /*left: 0;*/
              /*bottom: -10px;*/
              /*width: 0px;*/
              /*height: 3px;*/
              /*background: #fff;*/
              /*transition: 0.5s;*/
          }
           
          .form h2:hover:before {
              width: 53px;
          }
           
          .form .inputBox {
              width: 100%;
              margin-top: 20px;
          }
           
          /* 輸入框樣式 */
           
          .form .inputBox input {
              width: 100%;
              padding: 10px 20px;
              background: rgba(255, 255, 255, 0.2);
              outline: none;
              border: none;
              border-radius: 30px;
              border: 1px solid rgba(255, 255, 255, 0.5);
              border-right: 1px solid rgba(255, 255, 255, 0.2);
              border-bottom: 1px solid rgba(255, 255, 255, 0.2);
              font-size: 16px;
              letter-spacing: 1px;
              color: #fff;
              box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
          }
           
          .form .inputBox input::placeholder {
              color: #fff;
          }
           
          /* 登錄按鈕樣式 */
           
          .form .inputBox input[type="submit"],.form .inputBox input[type="reset"]  {
              background: #fff;
              color: #666;
              max-width: 100%;
              margin-bottom: 20px;
              font-weight: 600;
              cursor: pointer;
          }
           
          .forget {
              margin-top: 6px;
              color: #fff;
              letter-spacing: 1px;
          }
           
          .forget a {
              color: #fff;
              font-weight: 600;
              text-decoration: none;
          }
          

          同樣的道理我們來升級一下 loginsuccess 與 loginfail 。

          loginsuccess 代碼

          <%@ page contentType="text/html;charset=UTF-8" language="java" %>
          <html>
          <head>
              <title>登入成功界面</title>
              <link rel="stylesheet" href="css.css" type="text/css">
          </head>
          <body>
          <%--<div class="center">--%>
          <%--    <p class="fon">登入成功界面</p>--%>
          <%--    <p class="fon1">恭喜您成功登入,歡迎使用</p>--%>
          <%--    <a href="login.jsp">點擊退出,返回登入界面</a>--%>
          <%--</div>--%>
           
          <section>
              <div class="color"></div>
              <div class="color"></div>
              <div class="color"></div>
              <div class="box">
                  <div class="circle" style="--x:0"></div>
                  <div class="circle" style="--x:1"></div>
                  <div class="circle" style="--x:2"></div>
                  <div class="circle" style="--x:3"></div>
                  <div class="circle" style="--x:4"></div>
                  <div class="container">
                      <div class="form">
                          <h2> <h22>登錄成功</h22><br>
                          </h2>
                          <fon>恭喜您成功登入 <br>    歡迎使用 <br>
                              <a class="a1" href="login.jsp">返回登入界面</a>
                          </fon>
                      </div>
                  </div>
              </div>
          </section>
           
          </body>
          </html>
          

          loginfail 代碼

          <%@ page contentType="text/html;charset=UTF-8" language="java" %>
          <html>
          <head>
              <title>登入失敗界面</title>
              <link rel="stylesheet" href="css.css" type="text/css">
          </head>
          <body>
          <%--<div class="center">--%>
          <%--    <p class="fon">登入失敗界面</p>--%>
          <%--    <p class="fon1">對不起,您賬號或密碼有誤,請返回登入界面</p>--%>
          <%--    <a href="login.jsp">返回登入界面</a><br>--%>
          <%--    忘記密碼?<a href="amend.jsp">點擊修改密碼</a>--%>
          <%--</div>--%>
           
          <section>
              <div class="color"></div>
              <div class="color"></div>
              <div class="color"></div>
              <div class="box">
                  <div class="circle" style="--x:0"></div>
                  <div class="circle" style="--x:1"></div>
                  <div class="circle" style="--x:2"></div>
                  <div class="circle" style="--x:3"></div>
                  <div class="circle" style="--x:4"></div>
                  <div class="container">
                      <div class="form">
                          <h2> <h22>登錄失敗</h22><br>
                          </h2>
                          <fon>寶~是不是賬號或密碼記錯惹? <br>
                              <a class="a1" href="login.jsp">返回登入界面</a><br>
                              <p1><a href="amend.jsp">點擊修改密碼</a></p1>
                          </fon>
                          
                      </div>
                  </div>
              </div>
          </section>
           
          </body>
          </html>
          

          點擊運行,我們來看看效果

          那么這里我們是完成了,login總界面的效果,同樣的道理,代碼都差不多,我們直接 cv 大法,這里就給出重點要改的代碼。

          2、registercheck總代碼

          里面要重點改的代碼,一個是 sql 語句插入,另一個是時間格式轉換。

          tring sql = "insert into login(name, pass,time)VALUES(?,?,?)";

          SimpleDateFormat formatter = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");// 時間轉換,要不然就會是國際時間格式

          String data = formatter.format(new Date());// 記錄的是當前的時間

          ps.setString(3,data);

          3、logoutcheck總代碼

          3、logoutcheck總代碼

          里面要重點改的代碼,是 sql 語句刪除。

          String sql = "DELETE FROM login WHERE name =? and pass =?";

          4、amendcheck總代碼

          里面要重點改的代碼,是 sql 語句更新。

          String sql = "update login set pass='"+pass+"'";

          然后分別是各個總頁面的 success 與 fail 頁面來實現好,這里有一個小細節,我們在作拋出異常,這里可以 out.println 來打印出信息來測試,可以輸出在網頁上,這樣可以方便知道那里有異常。

          
          catch (ClassNotFoundException e) {
                      e.printStackTrace();
                      out.println("1");
                      // response.sendRedirect("registerfail.jsp");
                  } catch (SQLException e) {
                      e.printStackTrace();
                      out.println("2");
                      // response.sendRedirect("registerfail.jsp");
          
          

          好了,點擊運行,完成總效果。



































          作者:一個名叫追的程序猿

          原文出處:https://blog.csdn.net/aasd23/article/details/124458396?spm=1001.2100.3001.7377&utm_medium=distribute.pc_feed_blog_category.none-task-blog-classify_tag-16-124458396-null-null.nonecase&depth_1-utm_source=distribute.pc_feed_blog_category.none-task-blog-classify_tag-16-124458396-null-null.nonecase

          最開始作為一種使網站變得漂亮的方式,JavaScript 已轉變為一種嚴肅的編程語言。

          ? 來源:linux.cn ? 作者:Nimisha Mukherjee ? 譯者:Xingyu.Wang ?

          (本文字數:2310,閱讀時長大約:3 分鐘)


          JavaScript 的卑微起步始于 1995 年,是由當時在 Netscape 通信公司工作的 Brendan Eich 在短短 10 天內創建的 。從那時起,JavaScript 已經走過了漫長的道路,從一個讓網站變得漂亮的工具變成了一種嚴肅的編程語言。

          在其早期,JavaScript 被認為是一種視覺工具,它使網站變得更有趣和更有吸引力。像 Jakarta Server Pages (即 JSP,以前稱作 JavaServer Pages)這樣的語言曾經用來完成渲染網頁的繁重工作,而 JavaScript 則被用來創建基本的交互、視覺增強和動畫。

          長期以來,HTML、CSS 和 JavaScript 之間的分界并不明確。前端開發主要由 HTML、CSS 和 JavaScript 組成,形成了標準 Web 技術的“ 多層蛋糕 ”。

          標準網絡技術的“ 多層蛋糕 ”(Mozilla 開發者網絡, CC BY-SA 4.0 )

          HTML 和 CSS 為內容提供結構、格式和樣式。一旦網頁要做一些超越了顯示靜態內容的事情,就是 JavaScript 的用武之地。Ecma 國際部開發了 JavaScript 規范, 萬維網聯盟(World Wide Web Consortium)(W3C)開發了 HTML 和 CSS 規范。

          JavaScript 是如何獲得突出地位的

          JavaScript 是如何成為 最受歡迎的 編程語言的,背后有一段漫長的 歷史 。早在 20 世紀 90 年代,Java 是王者,不可避免的人們會與它進行比較。許多工程師認為 JavaScript 不是一門好的編程語言,因為它缺乏對面向對象編程的支持。盡管當時并不明顯,但其實 JavaScript 的對象模型和功能特性在其第一個版本中就已經出現了。

          1995 年 JavaScript 匆匆發布后,網景公司將其提交給了 歐洲計算機制造商協會(European Computer Manufacturers Association)(ECMA)國際部進行標準化。由此產生了 ECMAScript ,這是一個 JavaScript 標準,旨在確保不同 Web 瀏覽器之間網頁的互操作性。ECMAScript 1 于 1997 年 6 月問世,幫助推進了 JavaScript 的標準化。

          在此期間,PHP 和 JSP 成為了服務器端編程語言的流行選擇。JSP 作為 通用網關接口(Common Gateway Interface)( CGI )的首選替代方案獲得了突出的地位,因為它可以在 HTML 中嵌入 Java 代碼。雖然它很受歡迎,但開發人員發現將 Java 嵌入 HTML 中是不自然的。此外,即使是 HTML 上最簡單的文本變化,JSP 也必須經歷一個耗時的生命周期。在今天的微服務世界里,面向 JSP 的頁面被認為是技術債務。

          PHP 的工作原理與 JSP 類似,但 PHP 代碼以一個通用網關接口( CGI )的可執行文件來處理。基于 PHP 的 Web 應用比基于 JSP 的應用更容易部署。總的來說,使用 PHP 更容易上手和運行。今天,PHP 和 JavaScript 是創建動態網站最流行的組合之一:PHP 作為服務器端腳本,JavaScript 作為客戶端腳本。

          伴隨著 2006 年 jQuery 的發布,JavaScript 的應用越來越多。jQuery 是一個多用途的 JavaScript 庫,簡化了繁瑣的 文檔對象模型(Document Object Model)(DOM)管理、事件處理和 Ajax 。

          2009 年 Node.js 的發布是 JavaScript 發展的轉折點。開發者現在可以用 JavaScript 編寫服務器端腳本了。緊隨其后的是 2010 年發布的 Backbone.js 和 AngularJS 等框架。這導致了出現了使用單一語言進行全棧開發的概念。

          2015 年,Ecma 國際部發布了 ECMAScript 6(ES6),它為編寫復雜的應用程序增加了包括類聲明在內的重要新語法。其他新特性還包括迭代器、箭頭函數表達式、let 和 const 關鍵字、類型化數組、新的集合(映射、集合和 WeakMap)、Promise、字符串的模板字元以及許多其它很酷的特性。后來的版本又繼續增加了更多的功能,使 JavaScript 更加強大、精簡和可靠。

          總結

          在過去的 20 年里,JavaScript 有了長足的進步。現在大多數瀏覽器都在爭相滿足合規性,因此最新的規范推出得更快。

          根據你的項目需求,有大量穩定的 JavaScript 框架可供選擇,包括最流行的 React 、 Angular 和 Vue.js 等等。在本系列的下一篇文章中,我將深入探討為什么 JavaScript 如此受歡迎。


          via: opensource.com

          作者: Nimisha Mukherjee 選題: lujun9972 譯者: wxy 校對: wxy

          本文由 LCTT 原創編譯, Linux中國 榮譽推出

          點擊“了解更多”可訪問文內鏈接


          主站蜘蛛池模板: 国产综合精品一区二区| 国产免费播放一区二区| 日本福利一区二区| 国产在线一区二区三区| 最新中文字幕一区二区乱码| 国产一区二区中文字幕| 精品女同一区二区三区在线 | 国产AV一区二区三区传媒| 国产在线一区观看| 中文字幕精品一区二区| 日本高清不卡一区| 国产一区二区三区亚洲综合| 91精品乱码一区二区三区| 无码人妻精品一区二区三区夜夜嗨 | 日韩一区二区在线观看视频| 亚洲国产精品成人一区| 日本福利一区二区| 久久精品成人一区二区三区| 亚洲码一区二区三区| 国产区精品一区二区不卡中文 | 伊人久久精品无码麻豆一区| 午夜DV内射一区二区| 91精品一区国产高清在线| 加勒比精品久久一区二区三区| 中文字幕在线不卡一区二区| 久久无码AV一区二区三区| 乱精品一区字幕二区| 久久精品国产一区| 国产亚洲无线码一区二区| 日本不卡在线一区二区三区视频| 国模大尺度视频一区二区| 中文字幕一区视频一线| 熟女性饥渴一区二区三区| 国产一区二区四区在线观看| 国产在线精品一区二区高清不卡| 国产一区三区二区中文在线| 国产综合精品一区二区三区| 精品乱人伦一区二区三区| 久草新视频一区二区三区| 久久久无码一区二区三区 | 在线精品国产一区二区三区|