如何从子div更改父div中的内容?

时间:2012-11-27 22:53:50

标签: jquery

我试图在不改变子div内容的情况下修改来自子div的父div中的文本。

我有

<div id='testDiv'>
    this is the test parent div
    <div id='child1'>
         lots of contents and child div
         ...................
    </div>
    more div/child div and contents...

</div>

在我的jquery

$('child1 div a').click(function(){
    $('#testDiv').text('new text');  //this will remove the child1 div and all the contents inside testDiv
    //I want to replace 'this is the test parent div' text to 'newt text' 
})

有没有办法完成这项工作?非常感谢!

4 个答案:

答案 0 :(得分:2)

尝试混合使用.filter().contents()

$('#child1 div a').click(function() {
    $('#testDiv').contents().filter(function() {
        if (this.nodeType != 1 && this.data.trim() != '') {
            return this.data = 'New Text';
        }
        else {
            return this
        };
    });
})​

<强> Check Fiddle

答案 1 :(得分:2)

您可以使用firstChild属性:

​document.getElementById('testDiv').firstChild.nodeValue = 'new text'​​;

http://jsfiddle.net/vstHS/

答案 2 :(得分:1)

如果您将文本换行,则更改它会更容易:

$('#testDiv').contents()
             .filter(function(){return this.nodeType === 3})
             .wrap($('<span />',{'class':'test'}));

$('.test').text('new text');

FIDDLE

如果span元素导致某种问题,你可以在文本节点改变后解开吗?     

答案 3 :(得分:-2)

您只需要将要更改的部分包含在另一个div中并直接定位...

<div id='testDiv'>
    <div id='changeMe'>
        this is the test parent div
    </div>
    <div id='child1'>
         lots of contents and child div
         ...................
    </div>
    more div/child div and contents...
</div>

jquery:

$('child1 div a').click(function(){
    $('#changeMe').text('new text');
})