使用没有 ID 和标签名称的 javascript 更改 DIV 文本

Change DIV text using javascript without Id and tagname

本文关键字:javascript 更改 DIV 文本 标签名 ID      更新时间:2023-09-26

我有这个代码

<div class="points">
   <span>your points:</span>
   <div>29 P</div>
   <div>0 EXP</div>
</div>

我的代码中有多个 DIV 标签,我想更改第二个div 的文本名称标签或 id 代码。实际上我想用我的代码替换此文本,我已经使用js一个简单的CSS注入器尝试过这个

function injectCSS(str) {
    var node = document.createElement('style');
    node.innerHTML = str;
    document.body.appendChild(node);
}
injectCSS('div.points div:nth-child(2) { color: red } ');
injectCSS('div.points div:nth-child(2) { background: silver } ');

但这不会删除文本,而是让我添加新文本

我认为您已经接近使用您的函数,但这可以通过简单地使用 JS querySelector 来完成:

<div class="points">
   <span>your points:</span>
   <div>29 P</div>
   <div>0 EXP</div>
</div>   

和:

var str = "My String",
    el = document.querySelector('div.points div:nth-child(2)');
    el.innerHTML = str;   

一旦你在变量中缓存了"HTML element",你就可以很容易地操作它的其他属性,如下所示:

el.style.color = "red";

附言。没有必要为此拉取jQuery

var str = "My String",
	el = document.querySelector('div.points div:nth-child(2)');
    
    el.innerHTML = str;
    el.style.color = "red";
<div class="points">
   <span>your points:</span>
   <div>29 P</div>
   <div>0 EXP</div>
</div>

我找到了,这段代码有效

$("div.points div:nth-child(2)").text("new text here");

没有标签名称或混乱的代码,简单的一行代码这也需要JQUERY。