< style type =" text / css "> table . timesTables { text - align : left ; border : 1 px solid gray ; } table . timesTables td { padding : 8 px 1 px ; } / * 세로 가로 */ td { font - size : 1 . 3 em ;} span { color : red ;}</ style >< script type =" text / javascript "> var arrCell = new Array ( ) ; / / 배열 선언 var arrNumber = new Array ( ) ; / / 배열 선언 var iCnt = 0 ; var cell = 4 ; var rows = 24 ; function gugudanStart ( ) { for ( var j = 0 ; j < cell ; j ++){ arrNumber = new Array ( ) ; iCnt = 0 ; while ( iCnt < rows ) { makeValue ( ) ; } arrCell [ j ] = arrNumber ; } timesTables _ 1 ( ) ;} function makeValue ( ) { var result 1 = Math . floor ( Math . random ( ) * 8 ) + 2 ; var result 2 = Math . floor ( Math . random ( ) * 8 ) + 2 ; var val = result 1 +' x '+ result 2 ; if ( checkDup ( val ) ) { arrNumber [ iCnt ] = val ; iCnt ++; }} function checkDup ( val ) { var bRtn = true ; arrNumber . some ( function ( item ) { if ( item == val ) { bRtn = false ; return ; } }); return bRtn ;} function timesTables _ 1 ( ) { var table = "< table border =' 0 ' class =' timesTables ' width =' 100 %'>"; var tdStart = "< td >"; var thead = ""; var tbody = ""; for ( var i = 0 ; i < cell ; i ++){ thead += "< th >" + ( i + 1 ) + "</ th >"; } for ( var k = 0 ; k < rows ; k ++){ if ( k < rows ) tbody += "< tr >"; for ( var kk = 0 ; kk < cell ; kk ++){ tbody += makeTd ( arrCell [ kk ] [ k ] ) ; }// if ( ( index + 1 ) % cell == 0 ) tbody += "</ tr >"; }/* arrNumber . forEach ( function ( item , index , array ) { origin += index + ':' + item + '< br >'; var answer = item . replace ( / x / gi , "*"); tbody += tdStart + item + " = " + eval ( answer ) + "</ td >"; if ( ( index + 1 ) % cell == 0 ) tbody += "</ tr >< tr >"; });*/ / / table += "< thead >" + thead + "</ thead >" + "< tbody >" + tbody + "</ tbody >" + "</ table >"; table += "< tbody >" + tbody + "</ tbody >" + "</ table >"; times _ tables . innerHTML = table ; if ( window . addEventListener ) { var objtd = document . getElementsByTagName ( " td "); for ( var i = 0 ; i < objtd . length ; i ++) { objtd [ i ] . addEventListener ( " mousedown ", function ( e ) { testAnswer ( this ) ;}); objtd [ i ] . addEventListener ( " touchstart ", function ( e ) { testAnswer ( this ) ;}); } / / document . getElementById ( " dragbar "). addEventListener ( " mousedown ", function ( e ) { dragstart ( e ) ;}); / / document . getElementById ( " dragbar "). addEventListener ( " touchstart ", function ( e ) { dragstart ( e ) ;}); }} function makeTd ( item ) { var tdStart = "< td >"; var answer = item . replace ( / x / gi , "*"); return tdStart + item + " = < span id =' answer ' style =' visibility : hidden '>" + eval ( answer ) + "</ span ></ td >"; } function answerView ( ) { var objanswer = document . getElementsByTagName ( " span ");//. getElementsByClassName ( " transform "); for ( var i = 0 ; i < objanswer . length ; i ++) { objanswer [ i ] . style . visibility = ' visible '; } } function testAnswer ( tdObj ) { / / times _ tables . innerHTML = ' test '; var objanswer 1 = tdObj . querySelector ( " span "); objanswer 1 . style . visibility = ' visible ';}</ script >< div id =" times _ tables ">< div style =" border : 1 px dashed # BDBDBD ; background - color : # D 1 B 2 FF ; width : 340 px ; height : 100 px ; margin - left : auto ; margin - right : auto ; padding : 5 px ; text - align : center ; line - height : 100 px ; vertical - align : middle ; border - radius : 50 px ; filter : alpha ( opacity = 30 ) ;">< span style =" color : # AA 3399 ; font - weight : 600 ;"> 뽀 민 ~♡ 구구단 랜덤 생성기 </ span ></ div ></ div >