why this script won't work?

Question

Well what I need is a script what works as follow,

Each new time the page opens, the iframe has to pick 1 of the 50 link to show randomly as possible. Now I did some research and I make the following script. It works on JS(dot)DO but it won't work on jsbin and when I try Chrome it wont work. So i need a little help with it, I hope someone can help me with it!

<iframe id="frame"></iframe>
        <script>
            (function() {
                var e = document.getElementById('frame'),
                    f = function( el, url ) {
                        el.src = url;
                    },
                    urls = [           
                    'link1',
                      // all links 1/50
                    'link50'],
                    i = 0,
                    l = urls.length;
             f( e, urls[Math.round(Math.random()*50)] );
             })();


        </script>

(sorry for the bad English, It's not my main language

Answer 1

Well, first of all you can't simply open any link in <iframe> due to browser security restrictions. You can read more at How to show google.com in an iframe? .

Now let's talk about the code itself.

<iframe id="frame"></iframe>
    <script>
        (function() {
            var e = document.getElementById('frame'),
                f = function( el, url ) {
                    el.src = url;
                },
                urls = [           
                'link1',
                  // all links 1/50
                'link50'],
                i = 0,
                l = urls.length;
         f( e, urls[Math.round(Math.random()*50)] );
         })();


    </script>

Why do you set the i variable? You do not use it in your code, and can delete it. Why do you multiple Math.random() by 50 if you have l . Multiply it by l it's more convenient. Consider this example:

<div id="divID"></div>
<script type="text/javascript">
  var e = document.getElementById('divID'),
  f = function( el, url ) {
      el.innerHTML = url;
  },
  urls = ['https://www.google.ru/', 'https://www.yandex.com/', 'http://www.bing.com/', 'https://www.yahoo.com/', 'https://duckduckgo.com/'],
  urlsLength = urls.length;
  f( e, urls[Math.floor( Math.random() * urlsLength )] );
</script>

You can check working example at http://jsfiddle.net/tfno031a/ (Just press the Run button in the upper left corner). You have to slightly modify it to load content into <iframe> (if you do have local urls). I hope this will help you. Good luck!

EDIT

Working example. I have a 1.html file in the same directory with the main file. Also pay attention to Math.floor() , I was careless in the beginning.

<iframe id='iframeID'></iframe>
<script type="text/javascript">
  var e = document.getElementById('iframeID'),
  f = function( el, url ) {
    el.src = url;
  },
  urls = ['1.html'],
  urlsLength = urls.length;
  window.onload = f( e, urls[Math.floor( Math.random() * urlsLength )] );
</script>