ajax入门学习篇2

1Dom是文档对象模型。是一种属性结构的。在java中一切元素都是对象,html中一切元素的都是节点。

2.<a href=”aaa.html”>sds</a>

A是元素节点,href是属性节点,sds是文本节点

3.getElementByid是查找元素节点

4.getElementsByName也是查找元素节点的。

5. getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。

6.hasChildNodes查看是否存在子节点。

7.nodename返回的是每种节点的名称。但是如果是文本节点在返回一个#text

8.取文本节点的方法就是先取元素节点,然后用子节点取。

9,取属性节点,先取元素节点,然后用getAttributeNode(“属性名”)取

10Nodetype如果是元素节点返回1,属性节点是2,文本节点3

11.nodevalue如果是元素节点返回为空,属性节点返回属性的内容,文本节点也返回内容

12.setattribute(“属性名”,“属性名字”)对节点添加属性

13.createElement()创建元素节点

14.createTextNode()创建文本节点

例子说明

<script type="text/javascript" language="javascript">

    var add = new Function('a', 'b', 'return a+b;');//这是函数定义的方法,构造方法定义

    alert(add(4, 4));

 

    function add1(a, b) {

        return a + b

    };//函数直接定义

    alert(add1(5, 9));

 

    function message() {

        alert(document.getElementById("a1").value);//可以得到value

        alert(document.getElementsByName("a2").length);//可以得到这个元素节点的个数

        alert(document.getElementsByTagName("input").length);//这里或得这个标签的个数

        alert(document.getElementById("a3").firstChild.nodeValue);//可以得到h1的文本节点

        alert(document.getElementById("a3").childNodes[0].nodeValue);

和上面的一样。

 

    }

</script>

</head>

<body>

    <form action="#" method="get" name="from1">

        <input type="text" id="a1" name="a2" value="aa"><input

            type="submit" value="提交" onclick="message()">

 

    </form>

    <h1 id="a3">你好</h1>

</body>

 

 

例题2.节点的替换。

<script type="text/javascript">

    window.onload = function() {//加载窗口,执行

        document.getElementById("bj").onclick = function() {//点击这个节点触发事件

            var biElement = document.getElementById("bj");//获取北京节点

            var cqElement = document.getElementById("cq");//获取重庆节点

            var pElement = biElement.parentNode;//获得北京节点的父节点

            pElement.replaceChild(cqElement, biElement);//用重庆节点把北京节点替换,但是下面的重庆节点会没有

        }

    }

</script>

</head>

<body>

    <input type="button" value="check">

 

    <ul>

        <li id="bj">北京</li>

        <li>天津</li>

        <li>杭州</li>

        <li>大连</li>

    </ul>

 

    <ul>

        <li id='cq'>重庆</li>

        <li>南京</li>

        <li>云南</li>

        <li>连云港</li>

    </ul>

</body>

 

3.对节点的添加

window.οnlοad=function(){

var liElement=  document.createElement("li");//创建一个元素节点

liElement.setAttribute("id","fish");//设置该节点的属性。

var liTextElement=document.createTextNode("");//创建一个文本节点

var foodElement=document.getElementById("food");//获取一个已经存在的父节点

foodElement.appendChild(liElement);//将创建的元素节点挂到上面

liElement.appendChild(liTextElement);//将创建的文本挂到元素节点上

 

}

</script>

</head>

<body>

<ul id="food">

 

</ul>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值