链接这个jquery表达式

Chain this jquery expression

本文关键字:表达式 jquery 链接      更新时间:2023-09-26

是否有一种方法来链这个jQuery表达式或改进它?我真正想做的就是把"my text"改成"new text"。

HTML:

<div id="myDiv">
   my text
  <span>button 1</span>
  <span>button 2</span>
</div>
Javascript:

var element = $("#myDiv");
var buttons = element.children().detach();
element.text("new Text");
element.append(buttons);
var element = $("#myDiv");
var buttons = element.children().detach();
element.text("new Text").append(buttons);

应该可以正常工作!你总是可以链接使用相同选择器的方法。

.contents()获取所有子节点,包括文本节点。获取第一个节点并更改textContent属性。

$('#myDiv').contents()[0].textContent = "new text";

如果你需要更复杂,你可能想看看Karl Swedberg的Text Children插件,它也提供了各种不同的选项。

jQuery主要关注于操作元素节点(nodeType 1),而不是在元素节点上下文之外操作文本节点。有时最好的方法是下拉到"raw JavaScript":)

根本不需要使用jQuery…对于这样的简单任务,纯JavaScript要快得多。

var element =  document.getElementById('myDiv');
element.innerHTML = element.innerHTML.replace('my text','new text');
http://jsfiddle.net/xAhA6/8/

一个简单的方法是用span来包装我的文本。然后你可以做$('#myDiv span').first().text('new text');

对于链接:

如此:

var element = $("#myDiv");
var buttons = element.children().detach();
element.text("new Text").append(buttons);

你可以让插件做你想做的事:

(function($){
 $.fn.changeText = function(newText) {
    return this.each(function() {
        var element = $(this);
        var divs = element.children().detach();
        element.text(newText).append(divs);
    });
 };
})(jQuery);
//use it like so:
$('#myDiv').changeText('new text');

如果你想继续操作$('#myDiv')

,你可以将其他方法链接到它

小提琴:http://jsfiddle.net/maniator/DQtjE/

为什么不用<p>来包装文本呢?那么你只需要:

$("#myDiv p").text("new Text");