javascript - 用元素替换字符串

Question

我有一个带有一些文本的 div <div>This is my initial text</div> 我想用我已经创建的输入框替换文本“初始”

就像是：

input=$("#myinput");
$("div").find("initial").replaceWith(input);

或者：

input=$("#myinput");
$("div").html().replace('initial',input);

但这些都不起作用

有什么想法吗？

Answer 1

为什么不用跨度围绕它，以便更容易找到：

<div>This is my <span id="replace">initial</span> text</div>

然后：

$('#replace').replaceWith(input);

Answer 2

尝试：

$("div").html($('div').text().replace('initial',input.html()));

虽然如果你的 jQuery 足够新，我更喜欢这个：

$("div").html($.parseHTML($('div').text().replace('initial',input.html())));

Answer 3

var input = $("#myinput");
$("div:contains(initial)").replaceWith(input);

小提琴

编辑：

仅替换“初始”一词：

var input = $("#myinput");
$("div:contains(initial)").html(function(_,html) {
     return html.replace('initial', input.get(0).outerHTML);
});

小提琴

Answer 4

这应该有效：

$("div").html(input)

编辑：实际上，不，它不会，你需要用某种元素包装“初始”，最好是用“id”或“class”元素，这样你就可以直接选择它。

编辑#2：

// Grab the actual HTML of the element you want to inject
var elementHTML = $(input).html();

// Loop over each DIV, though you really should use ID/class attributes
$("div").each(function() {
    var divHTML = $(this).html(); // Grab a copy of the DIV's HTML
    $(this).html(divHTML.replace('initial', elementHTML)); // Replace "initial" in the saved string with the element's HTML from above
});