[英]JQuery replace html element contents if ID begins with prefix
I am looking to move or copy the contents of an HTML element. 我希望移动或复制HTML元素的内容。 This has been asked before and I can get innerHTML() or Jquery's html() method to work, but I am trying to automate it.
之前已经问到这个问题,我可以使用innerHTML()或Jquery的html()方法来工作,但我正在尝试自动化它。
If an element's ID begins with 'rep_', replace the contents of the element after the underscore. 如果元素的ID以'rep_'开头,则在下划线后面替换元素的内容。
So, 所以,
<div id="rep_target">
Hello World.
</div>
would replace: 将取代:
<div id="target">
Hrm it doesn't seem to work..
</div>
I've tried: 我试过了:
$(document).ready(function() {
$('[id^="rep_"]').html(function() {
$(this).replaceAll($(this).replace('rep_', ''));
});
});
-and- -和-
$(document).ready(function() {
$('[id^="rep_"]').each(function() {
$(this).replace('rep_', '').html($(this));
});
});
Neither seem to work, however, this does work, only manual: 似乎没有工作,但是,这确实有效,只有手动:
var target = document.getElementById('rep_target').innerHTML;
document.getElementById('target').innerHTML = target;
Related, but this is only text. 相关,但这只是文字。 JQuery replace all text for element containing string in id
JQuery替换id中包含字符串的元素的所有文本
You have two basic options for the first part: replace with an HTML string, or replace with actual elements. 第一部分有两个基本选项:用HTML字符串替换,或用实际元素替换。
Option #1: HTML 选项#1:HTML
$('#target').html($('#rep_target').html());
Option #2: Elements 选项#2:元素
$('#target').empty().append($('#rep_target').children());
If you have no preference, the latter option is better, as the browser won't have to re-construct all the DOM bits (whenever the browser turns HTML in to elements, it takes work and thus affects performance; option #2 avoids that work by not making the browser create any new elements). 如果你没有偏好,后一个选项更好,因为浏览器不必重新构造所有DOM位(每当浏览器将HTML转换为元素时,它就需要工作,从而影响性能;选项#2避免了这一点通过不使浏览器创建任何新元素来工作。
That should cover replacing the insides. 这应该涵盖更换内部。 You also want to change the ID of the element, and that has only one way (that I know)
您还想更改元素的ID,这只有一种方式(我知道)
var $this = $(this)
$this.attr($this.attr('id').replace('rep_', ''));
So, putting it all together, something like: 所以,把它们放在一起,比如:
$('[id^="rep_"]').each(function() {
var $this = $(this)
// Get the ID without the "rep_" part
var nonRepId = $this.attr('id').replace('rep_', '');
// Clear the nonRep element, then add all of the rep element's children to it
$('#' + nonRepId).empty().append($this.children());
// Alternatively you could also do:
// $('#' + nonRepId).html($this.html());
// Change the ID
$this.attr(nonRepId);
// If you're done with with the repId element, you may want to delete it:
// $this.remove();
});
should do the trick. 应该做的伎俩。 Hope that helps.
希望有所帮助。
Get the id using the attr
method, remove the prefix, create a selector from it, get the HTML code from the element, and return it from the function: 使用
attr
方法获取id,删除前缀,从中创建选择器,从元素中获取HTML代码,并从函数返回:
$('[id^="rep_"]').html(function() {
var id = $(this).attr('id');
id = id.replace('rep_', '');
var selector = '#' + id;
return $(selector).html();
});
Or simply: 或者干脆:
$('[id^="rep_"]').html(function() {
return $('#' + $(this).attr('id').replace('rep_', '')).html();
});
From my question, my understanding is that you want to replace the id by removing the re-_ prefix and then change the content of that div. 根据我的问题,我的理解是你想通过删除重新_前缀来替换id,然后更改该div的内容。 This script will do that.
这个脚本会这样做。
$(document).ready(function() {
var items= $('[id^="rep_"]');
$.each(items,function(){
var item=$(this);
var currentid=item.attr("id");
var newId= currentid.substring(4,currentid.length);
item.attr("id",newId).html("This does not work");
alert("newid : "+newId);
});
});
Working Sample : http://jsfiddle.net/eh3RL/13/ 工作样本: http : //jsfiddle.net/eh3RL/13/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.