脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → AJAX相关 →

开始研究Ajax. 第一天

 更新时间：2006年06月30日 00:00:00   作者：  
开始研究Ajax. 第一天

首先，我是一个不适合学习程序的人，也不喜欢，因为我非常马虎，每次都会写错很多代码。不过出于对DOM，JS，CSS热爱，还是开始研究Ajax了。

什么是Ajax?
我答：首先Ajax的四个组成部分为[XMLHttpRequest]，[Javascript]，[DOM]，[CSS].这四个东西暂且不多解释。这四个东西的作用是 [XMLHttpRequest]负责与Web服务器通信，[Javascript]通过控制[DOM]来控制页面，[CSS]做页面修饰，当然也是被控制的对像。这就是Ajax。我所理解的。

下面是一个实例！
Ajax的Hello页！ Hello The World！

CODE:
<html>
<head>
    <title>Hello.the World</title>

<style type="text/css"><!--
    .declared { color:red; font-size:14px; }
    .programmed { color:blue; font-size:12px; font-weight:bold;}
--></style>

<script>
    window.onload=function() {
        var hello=document.getElementById('hello');  //通过ID找到元素
        hello.className='declared';

        var empty=document.getElementById('empty');
        addNode(empty,"reader of");
        addNode(empty,"Ajax in Action!");

        var children=empty.childNodes;
        for (var i=0;i<children.length;i++) {
            children[i].className='programmed';
        }

        empty.style.border='solid green 2px';  //直接为节点设置样式
        empty.style.width="200px";
    }

    function addNode(el,text){
        var childEl=document.createElement("div");  //创建新元素
        el.appendChild(childEl);
        var txtNode=document.createTextNode(text);  //创建文本元素
        childEl.appendChild(txtNode);
    }
</script>
</head>
<body>
    <p id="hello">Hello</p>
    <div id="empty"></div>
</body>
</html>
这个例子就是通过Javascript控制DOM，在页里面写内容还有就是对页面内容用CSS修饰。

相关文章

  • jQuery AJAX中readyState与status的区别与联系

    jQuery AJAX中readyState与status的区别与联系

    这篇文章主要介绍了 jQuery AJAX中readyState与status的区别与联系,非常不错，具有参考借鉴价值，需要的朋友可以参考下
    2017-03-03
  • Ajax跨域访问Cookie丢失问题的解决方法

    Ajax跨域访问Cookie丢失问题的解决方法

    这篇文章主要介绍了Ajax跨域访问Cookie丢失问题的解决方法,需要的朋友可以参考下
    2017-02-02
  • 基于Ajax的聊天机器人功能的实现

    基于Ajax的聊天机器人功能的实现

    这篇文章主要介绍了基于Ajax的聊天机器人,本文通过实例图文相结合给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2021-11-11
  • Ajax 表单验证 实现代码

    Ajax 表单验证 实现代码

    最近做了一个项目中的登录注册模块,大部分功能从一个网站里扣出来的,部分功能自己修改,自认为还是有点人性化的
    2009-05-05
  • AJAX的跨域问题解决方案

    AJAX的跨域问题解决方案

    跨域简单的说,就是从一个域名的网页去访问另一个域名网页的资源,下面这篇文章主要给大家介绍了关于AJAX的跨域问题解决的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-12-12
  • jQuery中ajax - get() 方法实例详解

    jQuery中ajax - get() 方法实例详解

    在JQuery中可以使用get，post和ajax方法给服务器端传递数据，接下来，通过本篇文章给大家介绍jquery中ajax-get()方法实例详解，有需要的朋友可以参考下
    2015-09-09
  • 基于Ajax技术实现文件上传带进度条

    基于Ajax技术实现文件上传带进度条

    这篇文章主要介绍了基于Ajax技术实现文件上传带进度条的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
    2016-06-06
  • ajax同步验证单号是否存在的方法

    ajax同步验证单号是否存在的方法

    这篇文章主要介绍了ajax同步验证单号是否存在的方法,涉及基于ajax的数据交互相关操作技巧,需要的朋友可以参考下
    2016-08-08
  • Ajax 通过城市名获取数据(全国天气预报API)

    Ajax 通过城市名获取数据(全国天气预报API)

    本文给大家分享全国天气预报API Ajax 通过城市名获取数据，通过html和js两部分代码实现天气预报效果，输入城市就会出现天气情况，效果非常棒，感兴趣的朋友可以参考下
    2016-11-11
  • 关于Ajax技术原理的3点总结

    关于Ajax技术原理的3点总结

    这篇文章主要介绍了关于Ajax技术原理的3点总结,需要的朋友可以参考下
    2014-12-12

最新评论