generate random string for div id

Question

I want to display YouTube videos on my website  but I need to be able to add a unique id for each video that s going to be shared by users  So I put this together  and I have run into a little problem  I am trying to get the JavaScript to add a random string for the div id  but it s not working  showing the string    lt script type  text javascript  src  jwplayer js  gt  lt  script gt   lt script type  text javascript  gt  function randomString length        var chars    0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz  split           if    length            length   Math floor Math random     chars length              var str           for  var i   0  i  lt  length  i              str    chars Math floor Math random     chars length              return str     var div   randomString 8    lt  script gt    lt div id  div    gt This text will be replaced lt  div gt    lt script type  text javascript  gt    jwplayer  div     setup        flashplayer    player swf        file    http   www youtube com watch v 4AX0bi9GXXY        controlbar    bottom        width    470        height    320         lt  script gt

User · Answer

window btoa String fromCharCode    window crypto getRandomValues new Uint8Array 5      Using characters except ASCII letters  digits        -  and     may cause compatibility problems  as they weren t allowed in HTML 4  Though this restriction has been lifted in HTML5  an ID should start with a letter for compatibility

User · Answer

Or you could use Cripto since it s already built in except in IE11  I swear these guys havent updated in years       https   developer mozilla org en-US docs Web API Crypto getRandomValues Examples   var id   new Uint32Array 10   window crypto getRandomValues array     I also found this      https   gist github com 6174 6062387 gistcomment-3255605   let length   32  let id   crypto randomBytes length  toString  base64      There s a lot of ways to do this  but for most people  there s no reason to reinvent the wheel

User · Answer

Based on HTML 4  the id should start from letter      ID and NAME tokens must begin with a letter   A-Za-z   and may be followed by any number of letters  digits   0-9    hyphens   -    underscores        colons        and periods          So  one of the solutions could be  alphanumeric      var length   9    var prefix    my-awesome-prefix-      To be 100  sure id starts with letter       Convert it to base 36  numbers   letters   and grab the first 9 characters      after the decimal    var id   prefix   Math random   toString 36  substr 2  length     Another solution - generate string with letters only     var length   9    var id   Math random   toString 36  replace    a-z   g      substr 0  length

User · Answer

I really like this function   function guidGenerator         var S4   function            return    1 Math random    0x10000  0  toString 16  substring 1              return  S4   S4    -  S4    -  S4    -  S4    -  S4   S4   S4         From Create GUID   UUID in JavaScript

User · Answer

I also needed a random id  I went with using base64 encoding   btoa Math random    substring 0 12    Pick however many characters you want  the result is usually at least 24 characters

User · Answer

I think some folks here haven t really focused on your particular question   It looks like the problem you have is in putting the random number in the page and hooking the player up to it   There are a number of ways to do that   The simplest is with a small change to your existing code like this to document write   the result into the page   I wouldn t normally recommend document write    but since your code is already inline and what you were trying do already was to put the div inline  this is the simplest way to do that   At the point where you have the random number  you just use this to put it and the div into the page   var randomId    x    randomString 8   document write   lt div id      randomId      gt This text will be replaced lt  div gt       and then  you refer to that in the jwplayer set up code like this   jwplayer randomId  setup     And the whole block of code would look like this    lt script type  text javascript  src  jwplayer js  gt  lt  script gt   lt script type  text javascript  gt  function randomString length        var chars    0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghiklmnopqrstuvwxyz  split           if    length            length   Math floor Math random     chars length              var str           for  var i   0  i  lt  length  i              str    chars Math floor Math random     chars length              return str     var randomId    x    randomString 8   document write   lt div id      randomId      gt This text will be replaced lt  div gt         jwplayer randomId  setup        flashplayer    player swf        file    http   www youtube com watch v 4AX0bi9GXXY        controlbar    bottom        width    470        height    320         lt  script gt      Another way to do it  I might add here at the end that generating a truly random number just to create a unique div ID is way overkill   You don t need a random number   You just need an ID that won t otherwise exist in the page   Frameworks like YUI have such a function and all they do is have a global variable that gets incremented each time the function is called and then combine that with a unique base string   It can look something like this   var generateID    function         var globalIdCounter   0      return function baseStr            return baseStr   globalIdCounter                   And  then in practical use  you would do something like this   var randomId   generateID  myMovieContainer         myMovieContainer1  document write   lt div id      randomId      gt This text will be replaced lt  div gt     jwplayer randomId  setup

User · Answer

2018 edit  I think this answer has some interesting info  but for any practical applications you should use Joe s answer instead   A simple way to create a unique ID in JavaScript is to use the Date object   var uniqid   Date now      That gives you the total milliseconds elapsed since January 1st 1970  which is a unique value every time you call that   The problem with that value now is that you cannot use it as an element s ID  since in HTML  IDs need to start with an alphabetical character  There is also the problem that two users doing an action at the exact same time might result in the same ID  We could lessen the probability of that  and fix our alphabetical character problem  by appending a random letter before the numerical part of the ID   var randLetter   String fromCharCode 65   Math floor Math random     26    var uniqid   randLetter   Date now      This still has a chance  however slim  of colliding though  Your best bet for a unique id is to keep a running count  increment it every time  and do all that in a single place  ie  on the server

User · Answer

I would suggest that you start with some sort of placeholder  you may have this already  but its somewhere to append the div    lt div id  placeholder  gt  lt  div gt    Now  the idea is to dynamically create a new div  with your random id   var rndId   randomString 8    var div   document createElement  div    div id   rndId div innerHTML    Whatever you want the content of your div to be     this can be apended to your placeholder as follows   document getElementById  placeholder   appendChild div     You can then use that in your jwplayer code   jwplayer rndId  setup         Live example  http   jsfiddle net pNYZp   Sidenote  Im pretty sure id s must start with an alpha character   ie  no numbers  - you might want to change your implementation of randomstring to enforce this rule   ref

User · Answer

i like this simple one   function randstr prefix        return Math random   toString 36  replace  0   prefix             since id should  though not must  start with a letter  i d use it like this   let div id   randstr  youtube div       some example values   youtube div 4vvbgs01076 youtube div 1rofi36hslx youtube div i62wtpptnpo youtube div rl4fc05xahs youtube div jb9bu85go7 youtube div etmk8u7a3r9 youtube div 7jrzty7x4ft youtube div f41t3hxrxy youtube div 8822fmp5sc8 youtube div bv3a3flv425

User · Answer

A edited version of  jfriend000 version                  Generates a random string                 param int length          return string             function randomString length              var chars    0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghiklmnopqrstuvwxyz  split              if  typeof length       number                 length    Math floor Math random     chars length                      var str               for  var i   0  i  lt  length   i                  str    chars Math floor Math random     chars length                      return str

User · Answer

Here is the reusable function to generate the random IDs    function revisedRandId          return Math random   toString 36  replace    a-z   g      substr 2  10          It will not start with the any number digit so it will be supported by CSS3

User · Answer

First  Assign an id to your div  Like this    lt div id  uniqueid  gt This text will be replaced lt  div gt    After that  add inside your  lt script gt  tag following code   Document getElementById  uniqueid   id   randomString 8

[javascript] generate random string for div id

Examples related to javascript