Javascript Создать элемент в двух отделах - PullRequest
Новая
       32

Javascript Создать элемент в двух отделах

0 голосов
/ 01 декабря 2011

Я хочу создать iframe, используя javascript, а затем вставить его в два раздела, каждый из которых имеет идентификатор "fblike".Я пытался использовать следующий код, но он не работал. 

<script type="text/javascript">
  (function(){
    var fb = document.createElement('iframe');
    fb.src = 'http://www.facebook.com/plugins/like.php?href='+encodeURIComponent(location.href)+'&amp;locale=en_US&amp;send=false&amp;layout=button_count&amp;width=90&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=verdana&amp;height=21';
    fb.scrolling = 'no';
    fb.frameborder = '0';
    fb.style = 'border:none; overflow:hidden; width:90px; height:21px;';
    fb.allowTransparency = 'none';
    document.getElementsById('fblike')[0].appendChild(fb);
  })();
</script>

Я знаю, что в коде должны быть некоторые ошибки, потому что я очень мало знаю о javascript.Любой, пожалуйста, помогите мне!Спасибо

ОБНОВЛЕНИЕ: Спасибо за помощь :) Я обновил код, чтобы убрать ошибки.Теперь у меня работает следующий код: 

<script type="text/javascript"> 
  (function(){
    var fb = document.createElement('iframe');
    fb.src = 'http://www.facebook.com/plugins/like.php?href='+encodeURIComponent(location.href)+'&locale=en_US&send=false&layout=button_count&width=90&show_faces=false&action=like&colorscheme=light&font=verdana&height=21';
    fb.style.cssText = 'border:none; overflow:hidden; width:90px; height:21px;';
    fb.frameBorder = '0';
    fb.scrolling = 'no';
    fb.allowTransparency = 'true';
    document.getElementById('fbabove').appendChild(fb.cloneNode(true));
    document.getElementById('fbbelow').appendChild(fb.cloneNode(true));
  })();
</script>

Ответы [ 4 ]

2 голосов
/ 01 декабря 2011

У вас не должно быть атрибута id с одинаковым значением на той же странице.Сначала исправьте это, иначе document.getElementById() никогда не будет работать должным образом (он возвращает только один элемент), а document.getElementsById() (с s) не существует.

1 голос
/ 01 декабря 2011

Во-первых, у вас есть тип.getElementById, так как только один элемент может иметь идентификатор на любой данной странице.

Во-вторых, поскольку существует только один, в [0]. 

document.getElementById('fblike').appendChild(fb);

в противном случае нам нужно больше подробностей, чтобы узнать, является ли это единственной проблемой, с которой вы столкнулись.

1 голос
/ 01 декабря 2011

Функция называется document.getElementById, и она возвращает один элемент, поскольку вы никогда не можете иметь более одного элемента с одинаковым идентификатором

Так что измените 

document.getElementsById('fblike')[0].appendChild(fb);

до 

document.getElementById('fblike').appendChild(fb);
0 голосов
/ 01 декабря 2011

На самом деле, вы хотите вставить два iframe в два div, верно?Вот код, который будет делать то, что вы хотите (не могу утверждать, что он оптимален, так как у вас есть дубликаты идентификаторов - как уже сказали люди, вам лучше сделать два отличных идентификатора, если возможно): 

<script type="text/javascript">
  (function(){
    var list = document.getElementsByTagName('div'), i, fb;
    for (i = 0; i < list.length; i++) {
        if (list[i].id == 'fblike') {
            fb = document.createElement('iframe');
            fb.src = 'http://www.facebook.com/plugins/like.php?href='+encodeURIComponent(location.href)+'&amp;locale=en_US&amp;send=false&amp;layout=button_count&amp;width=90&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=verdana&amp;height=21';
            fb.scrolling = 'no';
            fb.frameborder = '0';
            fb.style = 'border:none; overflow:hidden; width:90px; height:21px;';
            fb.allowTransparency = 'none';
            list[i].appendChild(fb);
        }
    }
  })();
</script>
...