在学习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，问题虽小，倒也折腾了我半天，希望给对初学者有所帮助，高手可以无视：）。
分享到：
相关推荐
3. **兼容性**：两者在现代浏览器中都得到了广泛支持，但在较老的浏览器中，可能需要确保`document.body`的存在，因为它在文档加载未完成时可能为`null`。 **应用场景**： - 当你需要快速地访问或操作`<body>`元素...
2. **类名选择器**: 如果元素有特定的类名，可以使用`document.getElementsByClassName(classname)`来获取所有具有该类名的元素集合，再通过索引获取特定元素。例如，`var elements = document....
document.body属性用于直接获取页面中的body元素，它是另一种快速访问页面特定部分的方法。 7. 通过选择器获取一个元素（querySelector） querySelector方法允许通过CSS选择器来获取页面中第一个匹配的元素。使用此...
4. **遍历Header和Body**：Envelope有两个子元素，Header和Body，可以使用`element.element("Header")`和`element.element("Body")`来获取。如果它们不存在，这些方法会返回null。 5. **获取并处理Body中的具体内容...
本文将深入探讨如何在JavaScript中获取DOM元素的绝对位置，包括多种方法和它们的兼容性问题。 首先，我们需要明确什么是DOM元素的绝对位置。绝对位置通常指元素相对于整个文档的位置，包含元素距离文档最顶部和最...
从一个元素开始，不断获取其相邻的元素节点，直到返回到初始元素或遇到null。 举例来说，如果你有一个HTML结构如下： ```html <body> 段落1 大学 班级 同学 </body> ``` 你可以用以下JavaScript代码遍历`...
`tagName`属性用于获取元素的标签名。`getElementById()`和`getElementsByTagName()`方法用于根据ID或标签名选择元素。例如，`getElementById("myParagraph")`将返回具有唯一ID“myParagraph”的元素，然后可以访问...
获取页面中具有特定ID的元素是最常见的DOM操作之一。可以使用`document.getElementById`方法来实现这一功能。 示例代码如下： ```html <title>never-online's website function changeDivText(strText) { var ...
在“JavaScript DOM 高级程序设计”（下）这一章节中，我们将继续深入探讨DOM（文档对象模型）的相关高级技术，包括但不限于事件处理、节点操作以及跨浏览器兼容性问题等。本章节将帮助开发者更熟练地掌握如何利用...
在Vue框架下，开发者可能会遇到使用`document.getElementById()`方法时，获取到的是旧页面的DOM元素值的问题。这一现象通常发生在页面通过路由进行切换时，尽管DOM结构已经发生了变化，但是通过该方法仍然获取到了...
原生JavaScript提供了`getElementById`, `getElementsByTagName`, `getElementsByClassName`等方法来获取DOM元素，这些方法在元素不存在时会返回`null`。 例如： ```javascript var element = document....
也可以使用`childNodes`特性，例如获取`<body>`下的第一个`<p>`元素： ```javascript var oFirstPara = oBody.firstChild; ``` #### 五、总结 DOM提供了强大的功能来操作HTML文档，包括创建、修改和删除元素。通过...
函数内部调用了`document.elementFromPoint()`方法来获取当前鼠标光标所在位置的DOM元素，并将其存储在变量`obj`中。最后，通过`console.log()`输出了该元素的文本内容。 为了使得这个函数能够在鼠标点击时被调用，...
这段代码首先创建了一个 XML 文档对象，然后创建了一个 `<body>` 元素并添加到了文档中，接着创建了一个文本节点并将其添加到 `<body>` 元素中。最后，使用 `XMLSerializer` 对象将整个文档序列化为字符串形式，并...
3. **DOM操作**：JavaScript提供了一系列方法来操作DOM，如`createElement`用于创建新元素，`appendChild`用于添加子节点，`removeChild`用于删除节点，`innerHTML`用于获取或设置元素的HTML内容等。 保存信息到XML...
接着，我们获取了XML文档的根元素，并进一步访问了`Body`和`Hotel`节点，以及`Hotel`节点的属性值。最后，我们遍历了`Rates`节点下的所有`Rate`元素。 ### JDOM JDOM（Java Document Object Model）是另一个强大的...
为了获取元素相对于文档顶部的坐标，需要进行递归累加，将当前元素的offsetLeft和offsetTop与它的offsetParent的相同属性值相加，直到offsetParent为null。这一过程可以使用while循环实现。这种方法的优点在于它能够...
在前端开发中，获取页面中元素的位置信息是一项常见的需求。元素的位置信息通常包括元素在页面上的偏移量（offset），元素的尺寸（width和height），以及元素相对于文档或其他元素的位置。本文将重点讨论如何使用...
1. `getAttribute(attribute)`：获取元素的指定属性值，如果属性存在则返回值，否则返回null。 2. `setAttribute(attribute, value)`：设置元素的指定属性值，创建新的属性或修改已存在的属性。 例如，以下代码演示...
然而，一个常见的问题是JavaScript代码可能会在DOM完全加载完成之前就执行，这会导致无法访问DOM元素，进而引发错误。为了确保JavaScript正确地与DOM交互，开发者必须等待DOM完全加载完毕后才执行相关的操作。本文将...