Javascript jqueryclone li+;子项、更新文本(在子标记中)和追加
我有一些非常酷的CSS,我想在Javascript jqueryclone li+;子项、更新文本(在子标记中)和追加,javascript,jquery,html,clone,innerhtml,Javascript,Jquery,Html,Clone,Innerhtml,我有一些非常酷的CSS,我想在中重用它们。我想克隆一个现有的(以便可以重用CSS),更新字段,然后将其附加到的末尾 我知道我可以这样做来找到 var temp = $(".chatboxcontent").find('li'); console.log(temp); 然后我可以像这样使用.clone。。。(这是正确的吗?) 因此,我需要删除一个,然后插入我自己的 HTML元素如下所示 <div class="chatboxcontent"> <li class
中重用它们。我想克隆一个现有的
(以便可以重用CSS),更新
字段,然后将其附加到
的末尾
我知道我可以这样做来找到
var temp = $(".chatboxcontent").find('li');
console.log(temp);
然后我可以像这样使用.clone
。。。(这是正确的吗?)
因此,我需要删除一个
,然后插入我自己的
HTML元素如下所示
<div class="chatboxcontent">
<li class="current-user-message">
<div class="avatar">
<img src="http://placehold.it/50x50">
</div>
<div class="chatboxmessagecontent">
<p>test</p>
<time datetime="2016-07-28 16:45:20 UTC" title="28 Jul 2016 at 04:45PM">
16:45 PM
</time>
</div>
</li>
<li class="current-user-message">
<div class="avatar">
<img src="http://placehold.it/50x50">
</div>
<div class="chatboxmessagecontent">
<p>test</p>
...and so on
var message_li = $(".chatboxcontent").find('li').clone();
$(message_li).innerHTML("p") = data.text;
$(".chatboxcontent").append(message_li);
从上面我得到了$(…)。innerHTML不是一个函数。那么如何删除元素,然后插入它呢
有没有更好的方法来实现这一点?其中有$(message\u li).innerHTML(“p”)=data.text
,您需要将其替换为$(message_li).html(data.text)代码>
此外,如果data.text
尚未像您所希望的那样包装在
标记中,您还可以执行以下操作:
$(message_li).html(''+data.text+'')代码>
另一个解决方案,我个人会做的是:
$('<li>').addClass('current-user-message').html($('.chatboxcontent').find('li').html()).appendTo(message_li);
$(').addClass('current-user-message').html($('.chatboxcontent').find('li').html()).appendTo(message_-li);
然后在外部样式表中包含。当前用户消息的CSS。其中有$(message\u li)。innerHTML(“p”)=data.text
,您需要将其替换为$(message_li).html(data.text)代码>
此外,如果data.text
尚未像您所希望的那样包装在
标记中,您还可以执行以下操作:
$(message_li).html(''+data.text+'')代码>
另一个解决方案,我个人会做的是:
$('<li>').addClass('current-user-message').html($('.chatboxcontent').find('li').html()).appendTo(message_li);
$(').addClass('current-user-message').html($('.chatboxcontent').find('li').html()).appendTo(message_-li);
然后在外部样式表中包含当前用户消息的CSS。您可以尝试以下操作:
$(".chatboxcontent") //Select the conatiner
.find('li:first') //Find the first 'li' element
.clone() //then clone it
.find('p') //Find the 'p' tag inside the cloned element
.html(data.text) // change the html of the 'p' tag
.end() // Return to the cloned 'li' with the 'p' tag changed
.appendTo('.chatboxcontent'); // append the cloned 'li' to the conatiner
演示:
我希望这会有所帮助。您可以尝试以下方法:
$(".chatboxcontent") //Select the conatiner
.find('li:first') //Find the first 'li' element
.clone() //then clone it
.find('p') //Find the 'p' tag inside the cloned element
.html(data.text) // change the html of the 'p' tag
.end() // Return to the cloned 'li' with the 'p' tag changed
.appendTo('.chatboxcontent'); // append the cloned 'li' to the conatiner
演示:
我希望这会有所帮助。而不是$(message\u li)代码>使用$(message_li).find(“p”).html(data.text)代码>,但它不包括CSS。换言之,它只是将它插入到quick的中,而不是$(message\u li).innerHTML(“p”)=data.text代码>使用$(message_li).find(“p”).html(data.text)代码>,但它不包括CSS。换句话说,它只是将它插入到这里快速的
Ok这很好,但是我的
克隆()函数的实现出了一些问题。我希望它克隆元素及其所有子元素。它应该克隆所有。chatboxmessagecontent
,然后将消息插入
标记中。我之所以需要这样做,是因为我需要在li
tagUpdated post title中维护CSS代码,以便更好地描述实现。如果每个的类都相同,则当前用户消息
,为什么不包括一个样式表,当您通过jQuery添加一个新的。当前用户消息?好的,这很好,但是我的clone()
函数的实现有问题。我希望它克隆元素及其所有子元素。它应该克隆所有。chatboxmessagecontent
,然后将消息插入
标记中。我之所以需要这样做,是因为我需要在li
tagUpdated post title中维护CSS代码,以便更好地描述实现。如果每个的类都相同,则当前用户消息
,为什么不包括一个样式表,当您通过jQuery添加一个新的。当前用户消息
时,该样式表将被应用?无效或意外的标记
,它在appendTo()
(因为.end()
?)我认为附件中有一个无效字符,它正在工作,请查看演示!完美的这正是我要找的:)无效或意外的令牌
它在appendTo()
上抱怨(因为.end()
?)我想appendTo中有一个无效字符
它正在工作,请查看演示!完美的这正是我想要的:)