AJAX 的小知识点

最新推荐文章于 2024-07-23 09:02:31 发布

加油程序员

最新推荐文章于 2024-07-23 09:02:31 发布

阅读量163

点赞数

本文链接：https://blog.csdn.net/zhangyujiao666/article/details/86169050

版权

传统的web编程中，服务器响应请求页面重新加载，服务器每次都会返回一个新的页面，因此传统web应用有可能很慢用户交互不友好。

Ajax就是解决页面重新加载的问题 AJAX可以使 js 通过XMLhttpRequest 对象直接与服务器进行交互通过HttpRequest 一个web页面
可以发送一个请求到web服务器并且接受web服务器返回来的信息，这个信息叫做响应报文，不用重新加载页面，这样用户感觉页面刷新
但是也看不到 js 后台进行的发送请求和接受响应

开发AJAX
（1）获取AJAX对象
由于浏览器之间的差异性需要考虑 IE浏览器和非IE浏览器
IE浏览器获取AJAX对象 new ActiveXObject (’ MicroSoft.XMLHttp’);
非IE浏览器获取AJAX对象 new XMLHttpRequest ( );

（2）获取AJAX核心代码如下
var xhr = null ;
if (window.XMLHttpRequest ){
//非IE浏览器
xhr = new XMLHttpRequest ( );
}else {
xhr = new XMLHttpRequest (’ MicroSoft.XMLHttp’);

   }
 (3)使用AJAX 对象发送请求
      form表单的提交请求有get 和 post 方法
      这两种方式也适用于 AJAX   AJAX对象发送请求的方式是open方法
      open (String  methodName , String url, boolean  isAny );
         
      methodName : 代表使用哪种方式提交数据 ，可选的有get 和post
      url : 代表的提交的服务器的url
      isAny：采用的是同步方式还是异步方式提交数据 true代表异步  false代表同步

GET方式发送请求
xhr . open (‘get’, 'check_username.do? username=Zs ',true );
xhr.onreadystatechange = f1;
xhr.send(null);
//注意 servlet程序是配置在服务器中的所以 servlet的 url 也就叫做服务器的url 服务器有很多
因为采用的是get方式提交所以要将参数放在url地址的后面，true 代表异步刷新
如果采用get方式提交 xhr.send(null);传入的参数必须是null
f1是从服务器返回数据的处理回调函数

2.POST请求方式
使用Post请求方式发送请求必须要在open()方法下面发送一个消息请求头是固定写法只需要记住照搬就行了
xhr.setRequestHeader( ‘content-type’,‘application/x-www-form-urlencoded’);

使用POST请求代码
xhr . open ('post', 'check_username.do',true );
 xhr.setRequestHeader( 'content-type','application/x-www-form-urlencoded');
//请求参数放在send方法里面
xhr.onreadystatechange = f1;
xhr.send( 'username=Zs' );
使用Post方法可以将请求参数放在send()方法里面  而get 方法是不可以的

编写服务器端的处理代码只需要返回部分数据
服务器从客户端获取数据，然后判断数据的正确性，并用response返回即可

4，编写事件处理函数（监听器）
AJAX的常用属性
onreadystatechange() 事件处理函数（监听器）该函数用来处理 readystateChange事件当readyState的值发生了改变从0 变到1
就会产生该事件
responseText : 获取服务器返回的文本数据。
responseXML : 获取服务器返回的XNL文档
status :获取服务器返回的状态码只有200返回的是成功的状态码其余均表示不正常
readyState: 是一个整数值分别是0, 1, 2, 3, 4,表示AJAX与服务器通信的状态，当值为4时表示AJAX对象已经完整的接受到了服务器返回的数据

  代码如下：
    xhr.onreadystatechange =  function(){
         if(readyState==4) {
              if(xhr.status==200){
                 //从服务器返回的文本
                var txt = xhr.requestText;
              //将文本信息返回到指定节点上
                document.getElementById ('user_msg' ) . innerHTML = txt;      
            }  else{
                   //服务器处理出错
                 document.getElementById ('user_msg').inneHTML = '验证出错';
               
              }
         }

     } ;

有一个用户登录的例子

文本响应类型
JSON响应类型
文本响应类型指的是在服务器中返回的数据是文本字符串类型，对于文本类型在AJAX的回调函数中不需要进行处理，直接显示即可

    如果客户端接收到的是服务器端的某些对象，就要使用JSON，JSON，也是字符串的一种表现形式，不过它的表现类型跟文本类型

有些不一样　　格式：　｛＂属性＂：值｝　
　　对于JavaScript 来说处理json字符串的格式，只需要用到eval函数就行该函数的格式如下：
eval (’(’ + txt+’ )’)

        js跨域问题
           是指js在不同的域之间进行的数据传输或通讯，
           比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。
           只要协议、域名、端口有任何一个不同，都被当作是不同的域。


           在js中，我们直接用XMLHttpRequest请求不同域上的数据时，是不可以的。
           但是，在页面上引入不同域上的js脚本文件却是可以的，jsonp正是利用这个特性来实现的。





   jsp向servlet传值大致有这么几种情况。

第一种超链接，在href=‘servletAction?id=xxx’
　　第二种form表单提交，当点击submit时，action=“servletAction” method=‘get/post’
　　第三种就是利用ajax,url=‘servletActionz’,当然了，这里也有get和post两种情况，get直接在url后面加问号传参，post会把参数放在实体内容里面。
　　最后在servlet那边用 request.getParameter(“参数名”)；就可以拿到了

============================================

Pattern类用于创建一个正则表达式,也可以说创建一个匹配模式,它的构造方法是私有的,不可以直接创建,但可以通过Pattern.complie(String regex)简单工厂方法创建一个正则表达式,

Pattern pattern = Pattern.compile("[abc]");
compile可以接收一个正则表达式作为参数。

接下来我们创建一个Matcher对象。Matcher的构造方法也是一个private方法，但是我们可以通过Pattern的Matcher方法来返回一个Matcher对象。

Matcher matcher = pattern.matcher(“hello abc”);

2）Java 正则表达式以a为例
. 任何字符
a ? a一次或一次也没有
a * a零次或多次
a + a一次或多次
a {n}? a恰好 n 次
a {n,}? a至少n次
a {n,m}? a至少n次，但是不超过m次

//范围

\d 数字：[0-9]
\D 非数字： [^0-9]
\s 空白字符：[ \t\n\x0B\f\r]
\S 非空白字符：[^\s]
\w 单词字符：[a-zA-Z_0-9]
\W 非单词字符：[^\w]

边界匹配器
^ 行的开头
$ 行的结尾
\b 单词边界
\B 非单词边界
\A 输入的开头
\G 上一个匹配的结尾
\Z 输入的结尾，仅用于最后的结束符（如果有的话）
\z 输入的结尾

456

var a = $(’#select’).val(); // 结果为 123
var b = $(’#select option:selected’).val(); // 结果为 123
var d = $(’#select option:selected’).attr(‘value’); // 结果为 123
var c = $(’#select option:selected’).text(); // 结果为 456
拿到option中的id
var way= $("#fu option:selected").attr(“id”);

===================================================

导向是带着某种倾向去分析问题，解决问题
面向
举例：按照梦中情人的标准去找对象就是具体目标未定但是选择倾向以定，而且是对象导向。
而找到之后再约会，不就是面向对象了吗

面向对象的三大特征：封装，继承、多态