javascript中如何改变文档树

最新推荐文章于 2023-11-29 15:25:08 发布

原创最新推荐文章于 2023-11-29 15:25:08 发布 · 837 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #文档 #浏览器 #html #c

html/css/javascript 专栏收录该内容

55 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，并通过JavaScript实现了对页面元素的重新排序。具体地，将段落元素移动到标题元素之前，展示了如何使用`insertBefore`方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一段简单的HTML代码如下：

<html>
<head>
<title>Hacking JavaScript</title>
</head>
<body>
<h1>Hello world!</h1>
<p>I am a JavaScript hacker!</p>
</body>
</html>

页面显示为：

加入一段javascript后代码如下：

<html>
<head>
<title>Hacking JavaScript</title>
</head>
<body>
<h1>Hello world!</h1>
<p>I am a JavaScript hacker!</p>
<script>
var a=document.getElementsByTagName("h1")[0];
var b=document.getElementsByTagName("p")[0];
a.parentNode.insertBefore(b,a);
</script>
</body>
</html>