Javascript节点的访问

今天看《权威华南》第6版384页的时候，准备在自己的网站试验一下这个例子，于是找到一个有DOM结构的网页，开始照着书上的代码，自己边想边写。

我的代码如下

HTML：

<div class="header_content"><div id="logo" class="logo" ><img alt="网站后台管理" src="data:images/man_logo.jpg"></div><div class="right_nav"><div class="text_left"><ul class="nav_list"><li><img width="8" height="21" src="data:images/direct.gif">网站后台管理系统</li></ul></div></div>
</div>

Javascript的代码如下：

<script type="text/javascript">
window.onload = function replace_Node(){var logo = document.getElementsByClassName("logo");   // alert(logo);var h2 = document.createElement("h2");var parent = logo.parentNode;// alert(parent.className);
    parent.replaceChild(h2,logo);h2.appendChild("logo");
}
</script>

差不多是按着书上的思路上写的代码，getElementsByClassName()这个方法，在IE8以及IE8以下是不能用，所以我用的火狐测试，火狐支持这种方法。当运行
到alert(logo);时，这是会弹出[Object HTMLElement],说明我已经找到了这个节点。可是到运行到alert(parent.className);的时候，却弹出 undefined ,没有定义。想了很久都找不出问题。我一开始以为是getElementsByClassName() 函数的问题，换成getElementById()也一样。后来想了一会，觉得这个函数难道返回的是一个Nodelist类数组，于是果断重写代码：

<script type="text/javascript">
window.onload = function replace_Node(){var logo = document.getElementsByClassName("logo")[0];   // alert(logo);var h2 = document.createElement("h2");var parent = logo.parentNode;// alert(parent.className);
    parent.replaceChild(h2,logo);h2.appendChild("logo");
}
</script>

这样写了之后，当再一次执行到 alert(parent.className); 的时候会弹出 "header_content".说明我已经获取到了class = '"logo"
的父节点;

请问你们遇到过类似的问题吗？

转载于:https://www.cnblogs.com/mynamexiaolong/archive/2013/05/31/3110000.html

Javascript节点的访问相关推荐

Javascript节点
目录 Javascript节点一.节点概述二.节点属性三.获取节点 3.1.获取父节点parentNode 3.2.获取子节点 3.2.1.所有子节点childNodes 3.2.2.子元素节点 ...
Android 在 SElinux下如何获得对一个内核节点的访问权限
点击打开链接 Android 5.0下,因为采取了SEAndroid/SElinux的安全机制,即使拥有root权限,或者对某内核节点设置为777的权限,仍然无法在JNI层访问. 本文将以用户自定义的 ...
Android 5.0 SEAndroid下如何获得对一个内核节点的访问权限
Android 5.0下,因为采取了SEAndroid/SElinux的安全机制,即使拥有root权限,或者对某内核节点设置为777的权限,仍然无法在JNI层访问. 本文将以用户自定义的内核节点/de ...
JAVASCRIPT C# 相互访问
空间管理您的位置: ITPUB个人空间 » .NET技术 » 日志 .NEt专家博客! JAVASCRIPT C# 相互访问上一篇 / 下一篇 2010-04-02 13:30:07 / 个人分 ...
服务器端可控情形的Javascript跨域访问解决方法
在最近的一个web项目中为了实现bookmark功能碰到了javascript跨域访问的问题.起初,在google上搜的很多解决方案并不适用于我的情形,只在有一篇文章中提到的远程加载javascrip ...
运用javascript的成员访问特性来实现通用版的兼容所有浏览器的打开对话框功能...
打开网页对话框,一般有三种方法:window.open.window.showModalDialog.window.showModelessDialog,每一种都有它的优点与不足.第一种方法:wind ...
JavaScript数组越界访问
JavaScript数组越界访问不会报错,只会返回undefined. let arr = ['t1', 't2']; console.log(arr[2]); // undefined 但这样访问会 ...
javascript --- 利用节点关系访问HTML元素
<input type="button" value="父节点"onclick="change(curTarget.parentNode);&q ...
C# 根据节点索引访问XML配置文件
查了一些,都是根据XML属性来访问指定节点,我这想根据节点索引来访问XML 首先上XML样式 1 <?xml version="1.0" encoding="utf ...

Javascript节点的访问

Javascript节点的访问相关推荐

最新文章

热门文章