javascript - 如何使用CSS交换div中的文本

Question

我正在开发一个数据平台，该平台具有特定于该平台的小部件我正在使用一个名为 map 的小部件，它显示 map 以及链接到数据库中 map 的标题。该 map 包含一个 div 标题:

<map>
<div class="title">Title</div>
other divs ..
</map>

当我编码时，我无法访问 div 标题，因为它包含在小部件中。我想使用 css 更改标题文本。

我查看了这些示例: How can I replace text with CSS?

并且做到了:

1. 第一个选项

   .标题{ 可见性:隐藏}

   .title:之后{

   content:"NewTitle" ;
   visibility:visible;
   

   }

但是“标题”只是被隐藏，但仍然占用空间，所以我的“NewTitle”没有居中

第二个选项

.标题{ 文本缩进:-9999px； 行高:0；}

.title:之前{

text-indent:0;
content:'Welcome Back!';
display:block;
line-height: initial;

}

但是我的 NewTitle 没有很好地显示。

如何才能在 CSS 中或最终在 Javascript 中将“标题”切换为“新标题”。

感谢您的帮助

编辑:显示页面的开头

灵 active 等...是标题

我无法访问 html 代码中 ods-map 下面写的内容，因为 ods-map 是一个小部件。我只能改变CSS。

Answer 1

JavaScript 解决方案是执行此操作的标准:

$('.title').html("new title here"); // jquery
document.getElementsByClassName("title")[0].innerHTML = "new title here" // pure JS

fiddle :

https://jsfiddle.net/qpq45Luc/1/