Jquery改变两个元素之间的文本



我想用JQuery改变两个元素之间的文本,但是我没有任何想法!

例如:

<input type='checkbox' name='ch1'>
    This text must be changed !!!
<input type='checkbox' name='ch2'>

另外,我对这个Html代码没有任何控制,所以我不能添加任何id或标签。

您可以在父元素上调用contents()来获取它的子文本节点,然后使用slice()和index()来定位您想要删除的文本节点。从这里开始,after()将允许您添加新内容:

var ch1 = $("input:checkbox[name=ch1]"),
    ch2 = $("input:checkbox[name=ch2]"),
    contents = ch1.parent().contents();
contents.slice(contents.index(ch1) + 1, contents.index(ch2)).remove();
ch1.after("The text was changed.");

您使用js replace函数替换您想要替换的文本下面是示例:http://jsfiddle.net/yangchenyun/8zFFc/

代码

var replacedText = $('input[name=ch1]').parent().html().replace('This text must change !!!', 'replaced text');
$('input[name=ch1]').parent().html(replacedText);

两个输入在一个更大的容器div?然后你可以设置div的innerHTML而不包含

你能添加这样的span吗?

<input type='checkbox' name='ch1'>
<span id="change"> This text must change !!!</span>
<input type='checkbox' name='ch2'>

这可能对你有帮助:

http://api.jquery.com/nextUntil/

我认为您可以尝试contents()选择您想要的复选框旁边的文本节点并将其删除。

但是,我认为它可能无法在IE6/7中工作。

try this

$(function(){
$('input:checkbox').parents().contents()

.filter( function(index){return (this.nodeType === 3 && $('input:checkbox').parents().contents().eq(index-1).attr('name') === 'ch1' ); }).remove(); });

点击这里查看结果

Using Vanilla JS:

document.getElementsByName('ch1')[0].nextSibling.nodeValue = "changed!"
<input type='checkbox' name='ch1'>
    This text must be changed !!!
<input type='checkbox' name='ch2'>

$(文档)时函数(){警报(getAllBetween("输入# ch1",输入# ch2));});函数getAllBetween(first,last) {var firstElement = $(firstElement);//第一个元素var lastElement = $(lastElement);//最后一个元素var collection = new Array();//元素的集合collection.push (firstElement);//添加第一个元素到集合$(first).nextAll().each(function(){//遍历所有兄弟姐妹var sibling = $(this).attr("id");//获取兄弟姐妹IDif (siblingID != $(lastElement).attr("id")){//如果siblingID不是lastElementcollection.push ($ ());//向Collection中添加兄弟元素} else{//如果Sib是LastElement,则返回else返回错误;//中断循环}});返回集合;//返回集合}

您可以使用段落

作为下面的文本

<input type='checkbox' name='ch1'>
<p id="change_text"> This text must change !!!</p>
<input type='checkbox' name='ch2'>

在jquery中使用

$("#change_text").html(" Your text here ");

最新更新