欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  IT编程

开始研究Ajax. 第一天

程序员文章站 2022-03-14 10:33:31
开始研究ajax. 第一天首先，我是一个不适合学习程序的人，也不喜欢，因为我非常马虎，每次都会写错很多代码。不过出于对dom，js，css热爱，还是开始研究aj...
开始研究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修饰。

上一篇： ajax实现标签导航

下一篇： 快速解决ajax传递为空但显示在页面上为undefined的问题

推荐阅读