`
米奈希尔
  • 浏览: 268218 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

Dom获取body元素出现null的问题

阅读更多

在学习dom操作中,当试图获取body元素时,发现获取的对象为空,下面是我的代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script type="text/javascript">
	var body = document.getElementsByTagName("body").item(0);
	alert(body);
</script>
</head>
<body id="body">
<p>Hello world!</p>
</body>
</html>

运行,弹出null提示框。 

 

代码很简单,原因其实也很简单,因为在执行script中的静态(全局)js脚本时,dom对象中的body元素还没有构建,所以为null。

如果把这段代码放在js函数中(区别于js静态(全局)代码),比如onload中,如下所示:

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script type="text/javascript">
	window.onload = function() {
		var body = document.getElementsByTagName("body").item(0);
		alert(body);
	};
</script>
</head>
<body id="body">
<p>Hello world!</p>
</body>
</html>

 

这样就不会有问题了。

 

刚开始学ajax,问题虽小,倒也折腾了我半天,希望给对初学者有所帮助,高手可以无视:)。

0
0
分享到:
评论

相关推荐

    获取body标签的两种方法

    3. **兼容性**:两者在现代浏览器中都得到了广泛支持,但在较老的浏览器中,可能需要确保`document.body`的存在,因为它在文档加载未完成时可能为`null`。 **应用场景**: - 当你需要快速地访问或操作`&lt;body&gt;`元素...

    准确找到DOM树的元素

    2. **类名选择器**: 如果元素有特定的类名,可以使用`document.getElementsByClassName(classname)`来获取所有具有该类名的元素集合,再通过索引获取特定元素。例如,`var elements = document....

    详解JS获取HTML DOM元素的8种方法

    document.body属性用于直接获取页面中的body元素,它是另一种快速访问页面特定部分的方法。 7. 通过选择器获取一个元素(querySelector) querySelector方法允许通过CSS选择器来获取页面中第一个匹配的元素。使用此...

    利用DOM4J解析SOAP的简单示例

    4. **遍历Header和Body**:Envelope有两个子元素,Header和Body,可以使用`element.element("Header")`和`element.element("Body")`来获取。如果它们不存在,这些方法会返回null。 5. **获取并处理Body中的具体内容...

    JS中获取 DOM 元素的绝对位置实例详解

    本文将深入探讨如何在JavaScript中获取DOM元素的绝对位置,包括多种方法和它们的兼容性问题。 首先,我们需要明确什么是DOM元素的绝对位置。绝对位置通常指元素相对于整个文档的位置,包含元素距离文档最顶部和最...

    JavaScript程序设计-操作DOM元素的节点及关系.pdf

    从一个元素开始,不断获取其相邻的元素节点,直到返回到初始元素或遇到null。 举例来说,如果你有一个HTML结构如下: ```html &lt;body&gt; 段落1 大学 班级 同学 &lt;/body&gt; ``` 你可以用以下JavaScript代码遍历`...

    dom培训资料,教程

    `tagName`属性用于获取元素的标签名。`getElementById()`和`getElementsByTagName()`方法用于根据ID或标签名选择元素。例如,`getElementById("myParagraph")`将返回具有唯一ID“myParagraph”的元素,然后可以访问...

    DOM基础和基本API.txt

    获取页面中具有特定ID的元素是最常见的DOM操作之一。可以使用`document.getElementById`方法来实现这一功能。 示例代码如下: ```html &lt;title&gt;never-online's website function changeDivText(strText) { var ...

    JavaScript.DOM高级程序设计](下)

    在“JavaScript DOM 高级程序设计”(下)这一章节中,我们将继续深入探讨DOM(文档对象模型)的相关高级技术,包括但不限于事件处理、节点操作以及跨浏览器兼容性问题等。本章节将帮助开发者更熟练地掌握如何利用...

    javascript判断元素存在和判断元素存在于实时的dom中的方法

    原生JavaScript提供了`getElementById`, `getElementsByTagName`, `getElementsByClassName`等方法来获取DOM元素,这些方法在元素不存在时会返回`null`。 例如: ```javascript var element = document....

    js dom对象的操作

    也可以使用`childNodes`特性,例如获取`&lt;body&gt;`下的第一个`&lt;p&gt;`元素: ```javascript var oFirstPara = oBody.firstChild; ``` #### 五、总结 DOM提供了强大的功能来操作HTML文档,包括创建、修改和删除元素。通过...

    javascript获取鼠标点击元素对象(示例代码).docx

    函数内部调用了`document.elementFromPoint()`方法来获取当前鼠标光标所在位置的DOM元素,并将其存储在变量`obj`中。最后,通过`console.log()`输出了该元素的文本内容。 为了使得这个函数能够在鼠标点击时被调用,...

    《XML DOM标准》

    这段代码首先创建了一个 XML 文档对象,然后创建了一个 `&lt;body&gt;` 元素并添加到了文档中,接着创建了一个文本节点并将其添加到 `&lt;body&gt;` 元素中。最后,使用 `XMLSerializer` 对象将整个文档序列化为字符串形式,并...

    DOM保存XMl文件

    3. **DOM操作**:JavaScript提供了一系列方法来操作DOM,如`createElement`用于创建新元素,`appendChild`用于添加子节点,`removeChild`用于删除节点,`innerHTML`用于获取或设置元素的HTML内容等。 保存信息到XML...

    dom4j和jdom解析XML小例子

    接着,我们获取了XML文档的根元素,并进一步访问了`Body`和`Hotel`节点,以及`Hotel`节点的属性值。最后,我们遍历了`Rates`节点下的所有`Rate`元素。 ### JDOM JDOM(Java Document Object Model)是另一个强大的...

    js获取元素到文档区域document的(横向、纵向)坐标的两种方法

    为了获取元素相对于文档顶部的坐标,需要进行递归累加,将当前元素的offsetLeft和offsetTop与它的offsetParent的相同属性值相加,直到offsetParent为null。这一过程可以使用while循环实现。这种方法的优点在于它能够...

    js获取元素的偏移量offset简单方法(必看)

    在前端开发中,获取页面中元素的位置信息是一项常见的需求。元素的位置信息通常包括元素在页面上的偏移量(offset),元素的尺寸(width和height),以及元素相对于文档或其他元素的位置。本文将重点讨论如何使用...

    JavaScript学习笔记之DOM操作实例分析

    1. `getAttribute(attribute)`:获取元素的指定属性值,如果属性存在则返回值,否则返回null。 2. `setAttribute(attribute, value)`:设置元素的指定属性值,创建新的属性或修改已存在的属性。 例如,以下代码演示...

    JavaScript判断DOM何时加载完毕的技巧

    然而,一个常见的问题是JavaScript代码可能会在DOM完全加载完成之前就执行,这会导致无法访问DOM元素,进而引发错误。为了确保JavaScript正确地与DOM交互,开发者必须等待DOM完全加载完毕后才执行相关的操作。本文将...

Global site tag (gtag.js) - Google Analytics