[英]Replace text with HTML element
How can I replace a specific text with HTML objects?如何用 HTML 对象替换特定文本?
example:例子:
var text = "some text to replace here.... text text text";
var element = $('<img src="image">').event().something...
function ReplaceWithObject(textSource, textToReplace, objectToReplace);
So I want to get this:所以我想得到这个:
"some text to replace < img src...etc >.... text text text"
And I would like manipulate the object element without call again $()
method.而且我想操纵 object 元素,而无需再次调用$()
方法。
UPDATE: I solved.更新:我解决了。
thanx @kasdega, i made a new script based in your script, because in your script i can't modify the "element" after replace. thanx @kasdega,我根据您的脚本制作了一个新脚本,因为在您的脚本中我无法在替换后修改“元素”。 This is the script:这是脚本:
$(document).ready(function() {
var text = "some text to replace here.... text text text";
var element = $('<img />');
text = text.split('here');
$('.result').append(text[0],element,text[1]);
$(element).attr('src','http://bit.ly/mtUXZZ');
$(element).width(100);
});
I didnt know that append method accept multiples elements.我不知道 append 方法接受多个元素。 That is the idea, only need to automate for multiple replacements就是这样的想法,只需要自动化多个替换
do a split on the text you want to replace then use the array indexes 0 and 1...something like:对要替换的文本进行拆分,然后使用数组索引 0 和 1 ...类似于:
function ReplaceWithObject(textSource, textToReplace, objectToReplace) {
var strings = textSource.split(textToReplace);
if(strings.length >= 2) {
return strings[0] + objectToReplace.outerHTML() + strings[1];
}
return "";
}
UPDATE: I found another SO post Get selected element's outer HTML that pointed me to a tiny jquery plugin that helps here.更新:我发现另一个 SO 帖子获取选定元素的外部 HTML指向我一个微小的 jquery 插件在这里有帮助。
I believe this jsfiddle has what you want.我相信这个jsfiddle有你想要的。 outerHTML is the tiny jquery plugin I included in the JSFiddle. outerHTML 是我包含在 JSFiddle 中的微型 jquery 插件。
You can also use replace which will reduce some code: http://jsfiddle.net/kasdega/MxRma/1/您也可以使用 replace 来减少一些代码: http://jsfiddle.net/kasdega/MxRma/1/
function ReplaceWithObject(textSource, textToReplace, objectToReplace) {
return textSource.replace(textToReplace, objectToReplace.outerHTML());
}
function textToObj (text,obj,$src){
var className = "placeholder-"+text;
$src.html($src.html().replace(text,"<div class='"+className+"'></div>"));
$("."+className).replace(obj);
}
you can use $(selector).outerHtml to get the html string of an element您可以使用 $(selector).outerHtml 获取元素的 html 字符串
You can replace the html directly: http://jsfiddle.net/rkw79/qNFKF/可以直接更换html: http://jsfiddle.net/rkw79/qNFKF/
$(selector).html(function(i,o) { return o.replace('old_html','new_html'); }) $(selector).html(function(i,o) { return o.replace('old_html','new_html'); })
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.