使用jquery将HTML附加到节点
下面的HTML在相同的DATE类中显示日期和时间。这是不好的,因为我想独立地塑造他们。但我不能这样,所以我认为jquery可以注入来分裂它。使用jquery将HTML附加到节点
<div class="container">
<a class="title" href="http://www.example.com">Headlines Goes Here</a>
<div class="date">Jan 29, 2013 12:05:00 PM EST</div>
<div class="post">
<p>Content Goes Here</p>
</div>
</div>
我与人的帮助,希望这能与jQuery的日期类中附加来解决这样的输出是这样的:
<div class="container">
<a class="title" href="http://www.example.com">Headlines Goes Here</a>
<div class="date">Jan 29, 2013</div><div class="time">12:05:00 PM EST</div>
<div class="post">
<p>Content Goes Here</p>
</div>
</div>
这是我JQUERY,到目前为止,这是我风格为红色,所以我可以看到物理变化,有人可以帮助解决这个问题?我的jquery显然是不正确的。
$(window).load(function(){
if ($(".date:contains(', 2013')").length)
this.parentNode.append(this).html("</div><div class=time style=color:red>");
});
这是我的小提琴:http://jsfiddle.net/3ZWkQ/
理想情况下,你会想这样做的服务器端,以避免不得不改变实际的文件结构。
但是,如果这是不可能的,你可以做到这一点通过以下方式:
$(function() {
$(".date").after(function() {
var val = $(this).text();
var justDate = val.substring(0,12);
$(this).text(justDate);
var parsedTime = val.substring(12);
return "<div class=time >" + parsedTime + "</div>";
});
});
注意:在这里,我只是用子的分裂,但显然不会是正确执行,你最好解析为日期和格式化使用jQuery插件,样机等
这里Parts的小提琴: http://jsfiddle.net/MS3W6/
即完美。这解决了UI问题。谢谢。 – Evan 2013-02-12 19:48:06
很高兴听到:) – 2013-02-12 19:48:45
更改这一部分:
this.parentNode.append(this).html("</div><div class=time style=color:red>")
要:
$(this.parentNode).append("<div class=time style=color:red></div>")
刚刚尝试过,但没有返回预期结果。 – Evan 2013-02-12 19:08:51
'this.parentNode.append(本)的.html(”