js

来源:互联网 发布:索菲亚机器人 知乎 编辑:程序博客网 时间:2024/05/16 17:48

nodelist:

Array.prototype.testNodeList = "test nodelist";
function NodeList() {   
    var list = document.getElementsByTagName("li");   
    alert(list.testNodeList);   
}   
function test() {   
    alert(new Array().testNodeList); //test nodelist   
    NodeList(); //undefined   
}   
test();


parentNode:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Untitled Document</title>
        <script language="JavaScript">
            function test() {
                var node = document.getElementById("li1");
                alert(node.parentNode.id);
            }
        </script>
    </head>
    <body>
        <ul id="u">
            <li id="li1" class="li1">Magci</li>
            <li id="li2">J2EE</li>
            <li id="li3">Haha!</li>
        </ul>
        <input type="button" value="Click Me!" onClick="test();" />
    </body>
</html>


firstChild:

<div id="abc"><span>DIV的子对象</span></div>
<script language="javascript">
alert(document.getElementById('abc').firstChild.tagname); // 返回SPAN
alert(document.getElementById('abc').firstChild.innerHTML); // 返回"DIV的子对象"
</script>


lastChild:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div>
<p>下雨了</p>
<p>心好累</p>
</div>
</body>
<script>
var last=document.getElementsByTagName('div')[0]
console.log(last.lastChild);

</script>
</html>

previousSibling:
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script>
function get_previoussibling(n)
{
var x=n.previousSibling;
while (x.nodeType!=1)
{
x=x.previousSibling;
}
return x;
}

xmlDoc=loadXMLDoc("books.xml");

var x=xmlDoc.getElementsByTagName("author")[0];
document.write(x.nodeName);
document.write(" = ");
document.write(x.childNodes[0].nodeValue);

var y=get_previoussibling(x);

document.write("<br />Previous sibling: ");
document.write(y.nodeName);
document.write(" = ");
document.write(y.childNodes[0].nodeValue);

author = Giada De Laurentiis
Previous sibling: title = Everyday Italian

</script>
</html>


previousElementSibling:

<html>
<body>

<p>列表示例:</p>
<ul id="myList"><li id="item1">Coffee</li><li id="item2">Tea</li></ul>

<p id="demo">请点击按钮来获得第二个列表项的前一个同胞的 id。</p>

<button onclick="myFunction()">试一下</button>

<script>
function myFunction()
{
var itm=document.getElementById("item2");
var x=document.getElementById("demo"); 
x.innerHTML=itm.previousSibling.id;
}
</script>

<p><b>注释:</b>元素内的空白字符被视作文本,而文本被视作节点。</p>

<p>请在两个 <li> 元素之间添加空格,结果将是 "undefined"。</p>

</body>
</html>


appendChild:
<!DOCTYPE html>
<html>
<body>

<ul id="myList"><li>Coffee</li><li>Tea</li></ul>

<p id="demo">请点击按钮向列表中添加项目。</p>

<button onclick="myFunction()">亲自试一试</button>

<script>
function myFunction()
{
var node=document.createElement("LI");
var textnode=document.createTextNode("Water");
node.appendChild(textnode);
document.getElementById("myList").appendChild(node);
}
</script>

<p><b>注释:</b>首先创建 LI 节点,然后创建文本节点,然后把这个文本节点追加到 LI 节点。最后把 LI 节点添加到列表中。</p>

</body>
</html>

insertBefore:

<html>
<body>

<ul id="myList"><li>Coffee</li><li>Tea</li></ul>

<p id="demo">请点击按钮向列表插入一个项目。</p>

<button onclick="myFunction()">试一下</button>

<script>
function myFunction()
{
var newItem=document.createElement("LI")
var textnode=document.createTextNode("Water")
newItem.appendChild(textnode)

var list=document.getElementById("myList")
list.insertBefore(newItem,list.childNodes[0]);
}
</script>

<p><b>注释:</b><br>首先请创建一个 LI 节点,<br>然后创建一个文本节点,<br>然后向这个 LI 节点追加文本节点。<br>最后在列表中的首个子节点之前插入此 LI 节点。</p>

</body>
</html>


原创粉丝点击
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防,我是瞎子 干活累的手麻怎么办 月子手麻怎么办小妙招 电脑检测不到u盘怎么办 跟老婆三观不合怎么办 和老公三观不合怎么办 逗比人生爱之病怎么办 u盘无法识别怎么办修复 睾丸撞击后肿了怎么办 小孩脸过敏肿了怎么办 眼角肿了怎么办才能消肿 憋尿导致小腹痛怎么办 蛋蛋撞到了很疼怎么办 睾丸被压了好痛怎么办 睾丸皮肤痒破了怎么办 鸡儿下面了蛋痒怎么办? 射精后小腹胀该怎么办 手压伤了有淤血怎么办 手挤压伤了肿了怎么办 手被挤压肿了怎么办 手砸伤了肿了怎么办 手被机器压伤了怎么办 上眼皮眼睛肿了怎么办 上眼皮内有淤血怎么办 种睫毛眼睛红痛怎么办 一只眼睛变红了怎么办 黑眼球缺了一角怎么办 眼镜度数配高了怎么办 孩子近视800度可怎么办 儿童眼睛近视怎么办才能恢复正常 小孩眼睛近视怎么办才能恢复正常 3岁宝宝近视怎么办啊 6个月婴儿近视怎么办 近视眼的人老了怎么办 一千多度的近视怎么办 近视镜片磨花了怎么办 眼镜镜片磨花了怎么办 戴眼镜鼻梁有印怎么办 狗狗发烧怎么办最有效 狗狗感冒怎么办最有效 狗狗发烧去医院怎么办 眼睛里长了虫子怎么办