zoukankan      html  css  js  c++  java
  • ajax-jquery基础

    js警告框、确认框、提示框
    警告框alert alert("文本")
    -----用户点确定按钮后才能继续操作
    确认框confirm confirm("文本")
    -----用户点确定或取消按钮后才能继续操作
    提示框prompt prompt("文本","默认值")
    -----提示框经常用于提示用户在进入页面前输入某个值。
    当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。
    如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。
     
    如果弹框文案需要折行,使用+" "+连接
     
    jsfor循环
    for 循环是您在希望创建循环时常会用到的工具。
    下面是 for 循环的语法:
    for (语句 1; 语句 2; 语句 3) { 被执行的代码块 }
    语句 1 在循环(代码块)开始前执行
    语句 2 定义运行循环(代码块)的条件
    语句 3 在循环(代码块)已被执行之后执行
    实例
    for (var i=0; i<5; i++) { x=x + "The number is " + i + "<br>"; }
     
    jQuery
    jQuery是JavaScript的一个库,能实现对HTML和css的操作,如下
    改变HTML元素的内容
    $(selector).html(content)
    $("p").html("W3School");
    html() 函数改变所匹配的 HTML 元素的内容(innerHTML)
     
    向HTML元素追加内容,
    $(selector).append(content)
    $("p").append(" W3School");
     
    在HTML元素的前后区域追加内容;
    $("p").after(" W3School");
    $("p").before(" W3School");
     
    改变HTML元素的css属性,
    css("propertyname","value");
    $("p").css("background-color","yellow");
    为所有匹配元素设置 background-color 值
     
    改变多个css属性,
    css({"propertyname":"value","propertyname":"value",...});
    $("p").css({"background-color":"yellow","font-size":"200%"});
    为所有匹配元素设置 background-color 和 font-size
     
    获得元素的css属性
    $("p").css("background-color");
    将返回首个匹配元素的 background-color 值
     
    可以通过一行标记添加到JavaScript中,在head部门添加src ="jquery.js",如下
    向您的页面添加 jQuery 库
    jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数。
    可以通过下面的标记把 jQuery 添加到网页中:
    <head> <script type="text/javascript" src="jquery.js"></script> </head>
    请注意,<script> 标签应该位于页面的 <head> 部分。
     
    jQuery其他功能
    jQuery 语法实例
    隐藏当前的 HTML 元素。
    隐藏所有 <p> 元素。
    隐藏所有 class="test" 的元素。
    隐藏 id="test" 的元素。
     
    使用 $(selector).load(url) 来改变 HTML 内容。 使用 $.ajax(options) 来改变 HTML 内容。
    例子解释
     
    ajax
    Ajax的全称是:Asynchronous(异步) +JavaScript and XML
    AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。
    通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
    异步这个词是指AJAX应用软件与主机服务器进行联系的方式。如果使用旧模式(不使用ajax),每当用户执行某种操作、向服务器请求获得新数据,Web浏览器就会更新当前窗口。
     
    其常用的功能是:在页面不刷新的前提下,访问后台,获取后台数据,返回给前台。
    javaScript中的XMLHTTPRequest 对象是ajax技术的核心。包括向服务器发请求、服务器响应
    (一)服务器发请求
    如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 open()和send()方法
    方法
    描述
    open(method,url,async)
    规定请求的类型、URL 以及是否异步处理请求。
    method:请求的类型;GET 或 POST
    url:文件在服务器上的位置
    async:true(异步)或 false(同步)
    send(string)
    将请求发送到服务器。
    string:仅用于 POST 请求
    1、请求类型
    GET 还是 POST?
    与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
    然而,在以下情况中,请使用 POST 请求:
    • 无法使用缓存文件(更新服务器上的文件或数据库)
    • 向服务器发送大量数据(POST 没有数据量限制)
    • 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠n() 和 send() 方法
    post方法
    如果需要像 HTML 表单那样 POST 数据,请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据:
    xmlhttp.open("POST","ajax_test.asp",true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("fname=Bill&lname=Gates");
    方法
    描述
    setRequestHeader(header,value)
    向请求添加 HTTP 头。
    header: 规定头的名称
    value: 规定头的值
     
    2、URL
    open() 方法的 url 参数是服务器上文件的地址,该文件可以是任何类型的文件,比如 .txt 和 .xml,或者服务器脚本文件,比如 .asp 和 .php (在传回响应之前,能够在服务器上执行任务)。
     
    3、异步或同步
    AJAX 指的是异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。
    XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true:
    xmlhttp.open("GET","ajax_test.asp",true);
    对于 web 开发人员来说,发送异步请求是一个巨大的进步。很多在服务器执行的任务都相当费时。AJAX 出现之前,这可能会引起应用程序挂起或停止。
    通过 AJAX,JavaScript 无需等待服务器的响应,而是:
    • 在等待服务器响应时执行其他脚本
    • 当响应就绪后对响应进行处理
     
     
    (二)服务器响应
    如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
    属性
    描述
    responseText
    获得字符串形式的响应数据。
    responseXML
    获得 XML 形式的响应数据。
     
  • 相关阅读:
    Parameter 'xxx' not found. Available parameters are
    Windows下Redis开机自启动
    异常:找不到文件/无法解析
    远程连接MySQL数据库配置
    调用微信jssdk失败
    css+div 高度满屏
    常用JS正则表达式
    AVL树
    红黑树
    微信小程序实现自定义modal弹窗封装的方法
  • 原文地址:https://www.cnblogs.com/echoqi/p/8415507.html
Copyright © 2011-2022 走看看