Как вы клонируете, обновляете и добавляете переменную, используя JavaScript - PullRequest
Новая
       19

Как вы клонируете, обновляете и добавляете переменную, используя JavaScript

0 голосов
/ 21 сентября 2011

Я пытаюсь создать переменную со значением в «.comments», а затем перед «4 комментариями» добавить слово «Читать все».Наконец, добавьте новую переменную в «#comments».

Управляйте записью чего-либо, но он перемещает существующий объект вместо создания нового объекта со значением существующего.

Некоторый кодниже 

<script type="text/javascript">
var commentsLink = document.querySelector('.story .comments a'),    
    commentsSubmit = document.querySelector('#comments .form-item-submit');
commentsLink.innerHTML = 'Read all ' + commentsLink.innerHTML;
commentsLink.className += 'readComments';
commentsSubmit.appendChild(commentsLink);
</script>

<div class="story">
     <div class="comments">
           <a href="http://foo.com">4 comments</a>
     </div>
</div>
<div id="comments">
     <div class="form-item-submit">Submit</div>
</div>

Желаемый результат: 

<div class="story">
     <div class="comments">
           <a href="http://foo.com">4 comments</a>
     </div>
</div>
<div id="comments">
     <div class="form-item-submit">Submit</div>
     <a href="http://foo.com" class="readComments">Read all 4 comments</a>
</div>

Кто-нибудь может пролить свет на это?Нет вопросов, пожалуйста.

Ответы [ 3 ]

1 голос
/ 21 сентября 2011
  1. Чтобы клонировать элементы, используйте cloneNode. Чтобы скопировать текстовое содержимое, также используйте cloneNode(true).
  2. Вы хотите, чтобы клонированная ссылка добавлялась к элементу parent отправки div, а не внутри самой отправки div.

http://jsfiddle.net/eDGwj/

var commentsLink = document.querySelector('.story .comments a').cloneNode(true),
    commentsSubmit = document.querySelector('#comments .form-item-submit');

commentsLink.innerHTML = 'Read all ' + commentsLink.innerHTML;
commentsLink.className += 'readComments';

commentsSubmit.parentNode.appendChild(commentsLink);
0 голосов
/ 21 сентября 2011

Я думаю, что это то, что вы хотите, если нет, пожалуйста, прокомментируйте: 

<script type="text/javascript">
    var commentsLink = document.querySelector('.story .comments a'),    
        commentsSubmit = document.querySelector('#comments .form-item-submit');
    var cloneLink = commentsLink.cloneNode(true);
    cloneLink.innerHTML = 'Read all ' + commentsLink.innerHTML;
    cloneLink.className += 'readComments';
    commentsSubmit.appendChild(cloneLink);
</script>

Ключевой функцией был cloneNode (), следите за идентификатором

Подробнее

Надеюсь, это поможет

0 голосов
/ 21 сентября 2011

Примерно так: 

<script type="text/javascript">
var commentsLink = document.querySelector('.story .comments a'),    
    commentsSubmit = document.querySelector('#comments .form-item-submit'),
    anchor = commentsLink.cloneNode(false);

anchor.innerHTML = 'Read all ' + commentsLink.innerHTML;
anchor.className += ' readComments';

commentsSubmit.parentNode.appendChild(anchor);
</script>
...