JavaEE学习笔记整理

最新推荐文章于 2024-04-15 02:13:20 发布

青果.

最新推荐文章于 2024-04-15 02:13:20 发布

阅读量1.8k

点赞数 1

文章标签： java-ee js

本文链接：https://blog.csdn.net/qq_51861704/article/details/124231614

版权

JavaEE学习整理（二）

声明：本文来自菜鸟的学习整理，如有错误欢迎立即指出

1：Servlet的主要内容

（1）重定向

重定向是一种服务器指导，客户端的行为。客户端发出第一个请求，被服务器接收处理后，服务器会进行响应，在响应的同时，服务器会给客户端一个新的地址（下次请求的地址：response.sendRedirect(url)），当客户端接收响应后，会立刻马上自动根据服务器给的新地址发起第二个请求，服务器接收请求并作出响应，重定向完成。

重定向当中存在两个请求，并且属于客户端行为。

（2）请求转发和重定向的区别

（请求转发地址只能跳转到当前项目资源，而重定向可跳转到任意资源）

（3）Cookie对象

2：Javascript

（1）关于DOM的基础知识

基本概念：

DOM:(Document Object Model)文档对象模型。当网页被加载时，浏览器会创建文档对象模型。通过这个对象模型，JavaScript 获得创建动态 HTML 的所有力量：

JavaScript 能改变页面中的所有 HTML 元素
JavaScript 能改变页面中的所有 HTML 属性
JavaScript 能改变页面中的所有 CSS 样式
JavaScript 能删除已有的 HTML 元素和属性
JavaScript 能添加新的 HTML 元素和属性
JavaScript 能对页面中所有已有的 HTML 事件作出反应
JavaScript 能在页面中创建新的 HTML

对于javascript来说，DOM是js为了操作html所设置的一套接口；而对于html来说，dom让html形成一颗dom树，类似于一颗家族树（如图所示）

（2）与DOM相关的基础操作

alert：在javascript中，alert的用法是“alert(在对话框中显示的纯文本)”。alert方法用于显示带有一条指定消息和一个OK按钮的警告框，可以用来向用户警示信息，也可以用来调试程序。

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>js操作dom节点</title>
    <script src="demo.js"></script>
</head>
<body>
    <button onclick="func()">点我</button>
</body>
</html>

js代码：

function func(){
    alert("点击一下");//在对话框中显示纯文本
}

效果展示：

获取一个节点的值：

代码演示：

html：
<body>
    <button onclick="func()">点我</button>
    <button onclick="a()">点我1</button>
    <div id="parent">
        <div id="node">
            <p>JAVA</p>
        </div>
    </div>
</body>
js：
function a(){//获取节点的值
    var node=document.getElementById("node");
    var htm=node.innerHTML;
    alert(htm);
}

效果演示：

以下代码实现功能为：修改结点、在前后添加结点、删除结点等基础功能

<!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>js操作dom节点</title>
    <script src="demo.js"></script>
</head>
<body>
    <button onclick="func()">点我</button>
    <button onclick="a()">点我1</button>
    <button onclick="b()">点我2</button>
    <button onclick="c()">在parent结点后添加dom结点</button>
    <button onclick="d()">在node结点前添加dom结点</button>
    <button onclick="e()">删除dom结点</button>
    <div id="parent">
        <div id="node">
            <p>JAVA-node结点 </p>
        </div>
    </div>
</body>
</html>

function func(){
    alert("点击一下");//在对话框中显示纯文本
}
function a(){//获取节点的值
    var node=document.getElementById("node");
    var htm=node.innerHTML;
    alert(htm);
}
function b(){//修改节点的值
    var node=document.getElementById("node");
    var htm=node.innerHTML;
    alert(htm);
    node.innerHTML="<p>修改后的内容<p>"
}
function c(){//在parent结点后面添加dom结点
    var parent=document.getElementById("parent");//获得parent结点
    var p=document.createElement("p");
    var content=document.createTextNode("添加的内容");
    p.appendChild(content);
    parent.appendChild(p);
}
function d(){//在node结点前面添加dom结点
    var parent=document.getElementById("parent");//获得parent结点
    var node=document.getElementById("node");
    var p=document.createElement("p");//创建新节点
    var content=document.createTextNode("在node前添加的内容");
    p.appendChild(content);
    parent.insertBefore(p,node);
}
function e() {//删除dom结点
    var parent=document.getElementById("parent");//获得parent结点
    var node=document.getElementById("node");
    parent.removeChild(node);
}

页面展示：