如何在一个div中只改变文本?

时间:2022-05-15 12:00:05

I have html below. What I want to do depends on some conditions. I want to keep changing the text which is Sometitle.

我有下面的html。我想做什么取决于一些条件。我想不断地修改文本,也就是某标题。

<div id="header">
    Sometitle
    <div>
        <div>
            aa
        </div>
        <div>
            bb
        </div>
    </div>
</div>

I tried using Jquery below but it removes the other divs also.

我尝试使用下面的Jquery,但是它也删除了其他的div。

$("#header").text("Its a thrusday today !");

How do I get this done? I cannot modify this HTML in any case. I just have to use jquery and get this thing done.

我该怎么做呢?我在任何情况下都不能修改这个HTML。我只需要使用jquery就可以了。

Here is a jsfiddle I created : http://jsfiddle.net/qYUBp/

下面是我创建的jsfiddle: http://jsfiddle.net/qYUBp/

5 个解决方案

#1


3  

If you dont want it in a single line.

如果你不想把它放在一行里。

var tmp=$("#header>div").html();
$("#header").text("its thursday").append('<div>'+tmp+'</div>');

jsfiddle

jsfiddle

#2


3  

That text Sometitle is an orphan node, you are going to want to wrap an element around it to properly manipulate it

该文本Sometitle是一个孤儿节点,您将希望将一个元素包装在它周围以适当地操作它。

<div id="header">
    <span>Sometitle</span>
    <div>
        <div>
            aa
        </div>
        <div>
            bb
        </div>
    </div>
</div>

EDIT

编辑

But since you regrettably cannot change the html, you could do as the solution suggests in the other post. They had a typo that I corrected here:

但遗憾的是,由于您不能更改html,您可以按照另一篇文章中的解决方案进行更改。他们有一个错字,我在这里更正了:

var your_div = document.getElementById('header');
var text_to_change = your_div.childNodes[0];
text_to_change.nodeValue = 'new text';

check your updated JsFiddle

检查你的更新JsFiddle

#3


0  

try this

试试这个

$("#header").html($("#header").html().replace("Sometitle","Its a thrusday today !"));

#4


0  

for this case only, when rendering to browser

仅在这种情况下,当呈现给浏览器时

var new_s = "Its a thrusday today !";
var s = $("#header").children(":first").html();
$("#header").text(new_s+"<div>"+s+"</div>");

#5


0  

can you check this

你能检查这个

headerClone = $("#header").clone();
$(headerClone).find('div').remove();
var currentText = $(headerClone).html().replace(/(\r\n|\n|\r|\t)/gm,"");

newHtml = $("#header").html().replace(currentText,"Gotcha");
$("#header").html(newHtml);

JSFIDDLE

JSFIDDLE

#1


3  

If you dont want it in a single line.

如果你不想把它放在一行里。

var tmp=$("#header>div").html();
$("#header").text("its thursday").append('<div>'+tmp+'</div>');

jsfiddle

jsfiddle

#2


3  

That text Sometitle is an orphan node, you are going to want to wrap an element around it to properly manipulate it

该文本Sometitle是一个孤儿节点,您将希望将一个元素包装在它周围以适当地操作它。

<div id="header">
    <span>Sometitle</span>
    <div>
        <div>
            aa
        </div>
        <div>
            bb
        </div>
    </div>
</div>

EDIT

编辑

But since you regrettably cannot change the html, you could do as the solution suggests in the other post. They had a typo that I corrected here:

但遗憾的是,由于您不能更改html,您可以按照另一篇文章中的解决方案进行更改。他们有一个错字,我在这里更正了:

var your_div = document.getElementById('header');
var text_to_change = your_div.childNodes[0];
text_to_change.nodeValue = 'new text';

check your updated JsFiddle

检查你的更新JsFiddle

#3


0  

try this

试试这个

$("#header").html($("#header").html().replace("Sometitle","Its a thrusday today !"));

#4


0  

for this case only, when rendering to browser

仅在这种情况下,当呈现给浏览器时

var new_s = "Its a thrusday today !";
var s = $("#header").children(":first").html();
$("#header").text(new_s+"<div>"+s+"</div>");

#5


0  

can you check this

你能检查这个

headerClone = $("#header").clone();
$(headerClone).find('div').remove();
var currentText = $(headerClone).html().replace(/(\r\n|\n|\r|\t)/gm,"");

newHtml = $("#header").html().replace(currentText,"Gotcha");
$("#header").html(newHtml);

JSFIDDLE

JSFIDDLE