请教我有关DOM修改的所有知识

问题描述 投票:-3回答:1

im试图使文本编辑器可在每个站点上使用。它将A变成B。

我尝试了很多事情,例如

getelementbyid tampermonkey
1个回答
0
投票

嗨,也欢迎您使用Stack Overflow和JavaScript!目前尚不清楚您有多少JavaScript和HTML经验,因此这里有许多选择:

最好的入门方法是遵循在线教程或书籍来学习和练习新技能。像https://www.w3schools.com/js/js_htmldom_html.asphttps://www.digitalocean.com/community/tutorials/introduction-to-the-dom这样的网站可能是您入门的好地方。


如果您确实已经相当了解HTML和JS,但是不确定如何将它们链接在一起,请参考以下一些基本知识:

JS document对象包含大量方法和属性,可让您与网页或文档进行交互。当您创建HTML文件(如下面的文件)时,可以为页面上的元素设置ID和类名-本质上,它们类似于名称,以帮助您与这些元素进行交互。

这是一个非常基本的HTML文件:

<!DOCTYPE html>
<html>
<head>
  <title>An HTML webpage</title>
  <meta charset="UTF-8">
</head>
<body>

<h1 id="header" class="text">This is my webpage</h1>
<p id="body" class="text">This is the body text of my webpage!</p>

</body>
</html>

您可以看到我们给了h1元素,一个标题,id为“ header”和类为“ text”。没有两个元素可以共享相同的ID,但是它们可以共享类。这很有用,因为您可以将页面上的所有文本元素组合在一起,例如。

现在,如果我们想使用JavaScript编辑页面的标题文本,我们可以这样做:

document.getElementById("header").innerHTML = "A new header";

我们也可以这样做:

document.getElementsByTagName("h1")[0].innerHTML = "A new header";

注意:上面的JS将在页面上获得every h1元素,因此我们需要添加[0]仅获得第一个元素

如果您想要更改正文文本的颜色,则可以这样做:

document.getElementById("body").color = "blue";

现在这是您可以使用DOM修改的非常有限的视图,但是希望它将作为一个很好的起点。我建议您查看上面的网站。

如果此答案对您有帮助,请单击左侧的对勾/选中标记将其标记为正确-谢谢!

© www.soinside.com 2019 - 2024. All rights reserved.