본문 바로가기
블록체인 기반 핀테크 및 응용 SW개발자 양성과정 일기

[22일차] 20210413 fiverr slide 슬라이드 배열? 로 바꾸기 업그레이드 시키기

알로호모라 2021. 4. 13. 17:43
반응형

 

 

 

 

도넛 개수 상자에 넣눈거 답~ 최소의 박스를 구하는게 아닌 맞아 떨어지는 걸로 구하는거 

3x a + 5x b = donut 갯수  되게

 

donut = 21;

result = 0;

if ( donut%5 == 0){
    result = parseInt(donut/5);
} else {
    while(1){
        donut -= 3;
        result +=1;
        if (donut%5 == 0){
            result += parseInt(donut/5);
            break;
        } else if(donut <= 2){
            result = -1;
        }
    }
}

console.log(result);

 

while(1) 의 으ㅟ미 

 

while(1) will continuously run, until you break out of it. It's a short hand for DO-WHILE. So it says, while the idx does not equal -1, always run this loop. – Dan Nov 3 '17 at 11:08 

계속 go on till break 

 

 

 

 

let item = 0;
let boxItem = 0;
let flag = true;
let result;

function boxCount(n){
    item = n;
    if(item%5 == 0){ 
        result = (item/5) + boxItem;
        flag = false;
    } else if(item <= 0) {
        result = -1;
        flag = false;
    }
    item -= 3;
    boxItem++;
    if (flag) boxCount(item);
    return result;
}

result = boxCount(101);
console.log(result);

 

 

 

재귀함수

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let index=30;
        function apply(){
            if(index<=0){
                return; 
            }
            console.log(index);
            index--;
            apply();
        }
        apply();
        console.log(index);

    </script>
</body>
</html>

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let index=30;
        let box=0;

        function apply(){
            if(index<=0){
                return; 
            }
            console.log(index, box);
            index-=3;  //index = index - 3 한 값을 다시 index로 넣어라 ~ 
            box++;
            apply();
        }
        apply();
        console.log(index);

    </script>
</body>
</html>

-3될때마다 +1 변수 만들기 

 

 

 

return 이해하기 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
    
    
        function apply(){
            a =0;
            if(a == 0){
                if(true){
                    return 2;
                }
                console.log('hello'); //얘도 안찍힘 ~ 
            }
            return 3;  //위에 return으로 끝나서 얘는 실행 안됨. 
        }
    
        num = apply(); //num에 apply(); 값 담기 ~ 
        document.write(num);
    
    </script>
</body>
</html>

 

 

이게 바로 안나옴..

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
    
        for(i=0; i<11; i++){
            if(i%3==0){
                console.log('hello');
            }else{
                console.log(i);
            }
        }
        
    
    </script>
</body>
</html>

 

 

익명함수 콜백함수, 

ele , index- 인자값, 매개변수 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        window.addEventListener('DOMContentLoaded', init);

        function init(){

            let gnb=document.querySelectorAll('.gnb>li');
            gnb.forEach(function(ele){  //두번재 값 인덱스가 뭐지?
                console.log('aa');
                ele.innerHTML='aa';
            });
        }
    
    </script>
</head>
<body>

    <ul class="gnb">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>


</body>
</html>

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        window.addEventListener('DOMContentLoaded', init);

        function init(){

            let gnb=document.querySelectorAll('.gnb>li');
            gnb.forEach(function(ele, index){  //두번재 값 인덱스가 뭐지?
                ele.innerHTML='aaa_'+index;
            });
        }
    
    </script>
</head>
<body>

    <ul class="gnb">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>


</body>
</html>

 

 

 

 

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        hello();
        function hello(){
            console.log('hello');
            return 1;  //원래 쓰던 함수 ~ 
        }

        let hello2=function(){  //변수에 넣어쓰는 함수 ~ 
            /*code block*/
        }

    


    </script>
</head>
<body>



</body>
</html>

 

hello(); 를 function hello 위, 아래 상관없이 값이 나옴. 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
    
        function hello(){
            console.log('hello');
            return 1;  //원래 쓰던 함수 ~ 
        }

        let hello2=function(){  //변수에 넣어쓰는 함수 ~ 
            /*code block*/
            console.log('hallo');
        }

        hello2();
    


    </script>
</head>
<body>



</body>
</html>

 

근데 변수에 넣는 함수는 hello2(); 를 꼭 밑에다가 써야함

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
    
        function hello(){
            console.log('hello');
            return 1;  //원래 쓰던 함수 ~ 자바가 인지함 요 함수 ~ 
        }

        let hello2=function(){  //변수에 넣어쓰는 함수 ~ //변수에 익명함수 넣었기 때문에 아래부터 시작
            /*code block*/                  //
            console.log('hallo');
        }

        hello2();


        //arrow 함수 => (익명함수임)
        // ()에 인자값씀. {}내용 실행되는 부분 
        let hello3 = () => {console.log('hellooo')};  //얘도 익명함수를 넣은거라 hello3();를 위에 쓰면 에러남.       
        hello3(3);


    </script>
</head>
<body>



</body>
</html>

 

 

    <script type="text/javascript">
    
        function hello(){
            console.log('hello');
            return 1;  //원래 쓰던 함수 ~ 자바가 인지함 요 함수 ~ 
        }

        let hello2=function(){  //변수에 넣어쓰는 함수 ~ //변수에 익명함수 넣었기 때문에 아래부터 시작
            /*code block*/                  //
            console.log('hallo');
        }

        hello2();


        //arrow 함수 => (익명함수임)
        // ()에 인자값씀. {}내용 실행되는 부분 
        let hello3 = (num) => {console.log('hello'+num)};  //얘도 익명함수를 넣은거라 hello3();를 위에 쓰면 에러남.       
        hello3(3);

        let hello4 = num =>{ //인자값이 하나면 괄호 생략 가능 두개부터는 써야함 ~ 
            console.log('hellowww'+num);
        }
        hello4(4);

    </script>

 

        window.addEventListener('DOMContentLoaded', init);
        function init(){
            let gnb=document.querySelectorAll('.gnb>li');
            gnb.forEach(ele=>{  //요 안에 콜백함수, 익명함수(에로함수포함) 들어감 / 첫번째 인자값은 값 ㅇ
                console.log(ele);
            });
        }

        window.addEventListener('DOMContentLoaded', init);
        function init(){
            let gnb=document.querySelectorAll('.gnb>li');
            gnb.forEach((ele, index)=>{  //요 안에 콜백함수, 익명함수(에로함수포함) 들어감 / 첫번째 인자값은 값 ㅇ
                console.log(index, ele);
            });
        }

 

 

 

 

fiverr 소스 줄이기 

 

 

 

setInterval 함수 밖에서 사용. 함수가 똑같이 3초마다 실행

seTimeout() 몇 초후에 한번만 실행 함수 안에 있음. 재귀함수로 사용 가능.  -  

한번 실행하고 끝나는거( 근데 함수 안에 있으니 재귀로 반복됨) 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');



    index++;
    setTimeout();
}

 

 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    console.log(index);

    index++;
    setTimeout(hero, 3000);
}

hero();

 


let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    console.log(index);  //01234 5번 반복 

    ul.forEach((ele, i)=>{
        console.log(index, i, ele);
    });

    index++;
    setTimeout(hero, 3000);
}

hero();

index, ele, i  call them to see 

 

 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    //console.log(index);  //01234 5번 반복 


    let beNum = (index==0) ? ul.length : index-1; //한줄로 표현함. -1이면 ul.length로 만들라고 
    


    ul.forEach((ele, i)=>{
        console.log(index, i, ele);
        if(i==index){
            ele.setAttribute('class', 'hero on');
        }else if(beNum == i){
            ele.setAttribute('class', 'hero out');
        }else {
            ele.setAttribute('class', 'hero');
        }
    });

    index++;
    setTimeout(hero, 3000);
}

hero();

make it easier 

배열 중요하다ㅐ 

 

-> 

 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    //console.log(index);  //01234 5번 반복 
    let beNum = (index==0) ? (ul.length-1) : index-1; //한줄로 표현함. -1이면 ul.length로 만들라고 
    ul.item(index).setAttribute('class', 'hero on');  //첫번째부터 쭉 ~ on이 차례대로 붙음 
    ul.item(beNum).setAttribute('class', 'hero out');

/*
    ul.forEach((ele, i)=>{
        console.log(index, i, ele);
        if(i==index){
            ele.setAttribute('class', 'hero on');
        }else if(beNum == i){
            ele.setAttribute('class', 'hero out');
        }else {
            ele.setAttribute('class', 'hero');
        }
    }); */

    index++;
    setTimeout(hero, 3000);
}

hero();

이정도까지하면 화면에 문제는 없음

 

index, beNum만 처리하고 나머지 값은 없애ㅈ는걸 할거임

 

'js array delete' google 

 

index, beNum배열만 뺀 나머지 배열을 forEach 구문으로 처리

 

아래 요것을 

            var beNum=index-1;

    

            if(beNum==-1){

                beNum=4;

            }

 

    let beNum = (index==0) ? (ul.length-1) : index-1; 로 줄임 

 

 

 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    //console.log(index);  //01234 5번 반복 
    let beNum = (index==0) ? (ul.length-1) : index-1; //한줄로 표현함. -1이면 ul.length로 만들라고 
    ul.item(index).setAttribute('class', 'hero on');  //첫번째부터 쭉 ~ on이 차례대로 붙음 
    ul.item(beNum).setAttribute('class', 'hero out');

    newUl= Object.values(ul); // 배열처럼 생긴 Object로 반환 (실질적으로 배열과는 다름 . 사용은 비슷) Nodelist라는 객체다. 
    newUl[index] = undefined;
    newUl[beNum] = undefined;
    newUl.forEach((ele,i) =>{
        if(ele !=undefined){
            ele.setAttribute('class', 'hero');
        }
    });


/*
    ul.forEach((ele, i)=>{
        console.log(index, i, ele);
        if(i==index){
            ele.setAttribute('class', 'hero on');
        }else if(beNum == i){
            ele.setAttribute('class', 'hero out');
        }else {
            ele.setAttribute('class', 'hero');
        }
    }); */

    index++;
    setTimeout(hero, 3000);
}

hero();

ㅂ복잡쓰

 

let index =0;

function hero(){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if (index==ul.length) index = 0;
    //console.log(index);  //01234 5번 반복 
    let beNum = (index==0) ? (ul.length-1) : index-1; //한줄로 표현함. -1이면 ul.length로 만들라고 
    ul.item(index).setAttribute('class', 'hero on');  //첫번째부터 쭉 ~ on이 차례대로 붙음 
    ul.item(beNum).setAttribute('class', 'hero out');

    newUl= Object.values(ul).filter((ele,i)=>{
        if(i!=index && i!=beNum)ele.setAttribute('class', 'hero');
    });

    index++;
    setTimeout(hero, 3000);
}

hero();

요롷게도 가능~ 

 

완성본 

let index =0;

function hero(n){
    flag=(n==undefined) ? true : false;
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');
    if (index==ul.length) index = 0;
    //console.log(index);  //01234 5번 반복 
    let beNum = (index==0) ? (ul.length-1) : index-1; //한줄로 표현함. -1이면 ul.length로 만들라고 
    ul.item(index).setAttribute('class', 'hero on');  //첫번째부터 쭉 ~ on이 차례대로 붙음 
    if(flag) ul.item(beNum).setAttribute('class', 'hero out');

    ul.forEach((ele,i) =>{
        if(i!=index && i!=beNum){
            ele.setAttribute('class', 'hero');
        }
    });

    index++;
    setTimeout(hero, 3000);
}

hero(0);

근데 시작할 때 on animation 이 생김..

 

 

=============================혼돈으ㅣ 오전 수업 끝.. =======오후 시작 ============

 

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
    
    function banner(){
        let index =0;

        function slide(){
            if(index==10) index =0;
            index ++;
            console.log(index);
            setTimout(slide,1000);

        }
        slide();
    }

    banner();   
    
    </script>
</body>
</html>

한 함수안에서 index를 쓰려고 함수 2개 씀 ~ 

 

안그럼 index 1,2,3,4, 요렇게 배너 늘려나가야함 그거 방지하기 위해 함수 2 개 ~ 

 

 

 

 

객체 만드는 방법 2가지 

// 객체 생성 방법 

    obj = new Object();
    obj.name='자동차';
    obj.carName='아반뗴르';
    
    console.log(obj);
    console.log(window);

    obj2 = {
        name:'자동차',
        carName :'아반뛔',
    }

    console.log(obj2);

 

 

 

 

 

 

구글 드라이브 오늘 날짜에 썜이 배열 및 슬라이더 올려놔주심 참고 ㄱ 

 

 

구글드라이브에 올려진 것 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    
</head>
<body>
    <ul id="banner" class='gnb'>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

    <ul id="banner" class='gnb2'>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <script type="text/javascript">
        function banner(obj){
            let index = 0;
            function slide(){
                ul = document.querySelectorAll(obj.bannerContainer);
                if (index == ul.length) index = 0;
                let beNum = (index == 0) ? (ul.length-1) : (index -1);
        
                ul.item(index).setAttribute(obj.bannerItemId,obj.bannerItemIdOn);
                ul.item(beNum).setAttribute(obj.bannerItemId,obj.bannerItemIdOut);

                index ++;
                console.log(index);
                setTimeout(slide,obj.bannerTimer);
            }
    
            slide();
        }
        
        obj = new Object();
        obj.name = '자동차';
        obj.carName = '아반떼';
    
        obj2 = {
            bannerContainer:'.gnb > li',
            bannerItemId:'class',
            bannerItemIdDefault:'hero',
            bannerItemIdOn:'hero on',
            bannerItemIdOut:'hero out',
            bannerTimer:1000,
        }

        obj3 = {
            bannerContainer:'.gnb2 > li',
            bannerItemId:'class',
            bannerItemIdDefault:'hero',
            bannerItemIdOn:'hero on',
            bannerItemIdOut:'hero out',
            bannerTimer:2000,
        }
    
        banner(obj2);
        banner(obj3);
        </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{margin:0; padding:0;}
        ul,li{
            list-style:none;
        }

        #banner{
            display:flex;
            height:300px;
            flex-direction: row;
            flex-wrap: nowrap;
            margin-top:150px;
            width:300px;
            overflow:hidden;
        }

        #banner > li{
            width:300px;
            flex-shrink:0;
        }

        .hero{
            display:none;
        }

        .on{
            display:block !important;
        }

        .out{
            display:none;
        }

        #banner > li:nth-child(1){background:red;}
        #banner > li:nth-child(2){background:blue}
        #banner > li:nth-child(3){background:pink}
        #banner > li:nth-child(4){background:yellow;}
        #banner > li:nth-child(5){background:wheat}
        #banner > li:nth-child(6){background:violet}
        #banner > li:nth-child(7){background:yellowgreen}
        #banner > li:nth-child(8){background:turquoise}
        #banner > li:nth-child(9){background:tomato}
    </style>
</head>
<body>
    <ul id="banner" class='gnb'>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

    <ul id="banner" class='gnb2'>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

    <ul id="banner" class='gnb3'>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <script type="text/javascript">
        function Banner(data){
            let index = 0;
            function slide(n){
                flag = (n == undefined) ? true : false;
                let ul = document.querySelectorAll(data.bannerContainer);
                if (index == ul.length ) index = 0;
                let beNum = (index == 0) ? (ul.length-1) : index-1;
                console.log(ul);
                ul.item(index).setAttribute(data.bannerItemId,data.bannerItemIdOn);
                if(flag) ul.item(beNum).setAttribute(data.bannerItemId,data.bannerItemIdOut);

                ul.forEach((ele,i) =>{
                    if(i!=index && i!=beNum){
                        ele.setAttribute(data.bannerItemId,data.bannerItemIdDefault);
                    }
                });
                
                index++;
                console.log(index);
                setTimeout(slide,data.bannerTimer);
            }
            slide(0);
        }


        let json = [
            {
                bannerContainer:'.gnb > li',
                bannerItemId:'class',
                bannerItemIdDefault:'hero',
                bannerItemIdOn:'hero on',
                bannerItemIdOut:'hero out',
                bannerTimer:1000,
            },
            {
                bannerContainer:'.gnb2 > li',
                bannerItemId:'class',
                bannerItemIdDefault:'hero',
                bannerItemIdOn:'hero on',
                bannerItemIdOut:'hero out',
                bannerTimer:1500,
            },
            {
                bannerContainer:'.gnb3 > li',
                bannerItemId:'class',
                bannerItemIdDefault:'hero',
                bannerItemIdOn:'hero on',
                bannerItemIdOut:'hero out',
                bannerTimer:2000,
            }
        ]
        
        Banner(json[0]);
        //Banner(json[1]);
        //Banner(json[2]);
    </script>
</body>
</html>

 

 

 

========================어제 질문한거 답 =====================

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
        function apple(){
            console.log('a');
            return 1;
        }

        num = apple();   // num이라는 변수 안에 apple함수 를 넣어라 
            /// 실행도 시키는 거 ?? apple(); 처럼? 
        console.log(num); 
    </script>
</body>
</html>

num 이라는 변수 안에 apple()함수 값을 넣어라 ~ 그래서 return 이라는게 필요 

console.log(num) 이 없다면 num 안에 함수 apple값이 들어가있는 상태 

근데 함수에 console.log('a')가 있으니 그게 먼저 실행이 된것 

 

모달팝업이래

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{margin:0;padding:0;}
        ul,li{list-style: none;}

        #layer_popup_wrap{
            width:100vw;
            height:100vh;
            background-color: black;
            opacity:0.6;
            position:fixed;
            top:0;
            display:none;
        }

        #layer_popup{
            width:500px;
            height:500px;
            background-color: darkgoldenrod;
            position:absolute;
            left:50%;
            top:50%;
            transform: translate(-50%,-50%);
        }

        .close{
            width:80px;
            height:30px;
            background-color: darkgray;
            color:black;
            cursor: pointer;
            display:block;
            text-align: center;
        }

        .on{
            display:block !important;
        }

    </style>
</head>
<body>

    <button id="btn">레이어팝업</button>

    <div id="layer_popup_wrap" class="">
        <div id="layer_popup">
            호롤롤롯
            <span class="close">닫기</span>
        </div>
    </div>

    <script type="text/javascript">
        let BTN = document.querySelector('#btn');

        BTN.addEventListener('click', show);

        function show(){
            let layer=document.querySelector('#layer_popup_wrap');
            layer.setAttribute('class','on'); // 얘는 왜 안되진 ㅇ
            //layer.style.display='block'; ok 
            console.log(layer);
        }

    </script>

</body>
</html>

위에 저렇게 해도 됨. 근데 왜 아깐 안된건가...

 

 

 

요건 랜덤으로 0~4 번 사진 나와서 시작되는 거 

let index =0;

let item = Math.floor(Math.random()*5);
hero(item);

function hero(n){
    let ul = document.querySelectorAll('#header_hero_backgrounds>ul');

    if(n==undefined){
        if (index==ul.length) index = 0;

        let beNum = (index==0) ? (ul.length-1) : index-1; 
        ul.item(index).setAttribute('class', 'hero on'); 
        ul.item(beNum).setAttribute('class', 'hero out'); 

        ul.forEach((ele,i) =>{
            if(i!=index && i!=beNum){
                ele.setAttribute('class', 'hero');
            }
        });

    } else{
        ul.item(n).setAttribute('class', 'hero firston');
        index=n; 
    }

    index++;
    setTimeout(hero, 3000);
}

 

 

 

 

 

 

 

 

 

반응형

'블록체인 기반 핀테크 및 응용 SW개발자 양성과정 일기' 카테고리의 다른 글

[23일차] 배열 연습 / 배열 메서드, Array Method / filter, reduce, map, concat, sort, join etc.  (0) 2021.04.14
ZeroCho의 JS 초급강좌 2-4. 배열 기본 / 4-2. 배열 push pop shift unshift / 4-3. 배열 splice / 5-2. 이차원 배열 / 6-2. 배열 map method /  (0) 2021.04.14
[21일차 연습]  (0) 2021.04.13
[21일차] 20210412 반응형, 알고리즘, 재귀함수 등  (0) 2021.04.12
[20일차]20210409 fiverr 웹사이트 만들기 마지막  (0) 2021.04.09

'블록체인 기반 핀테크 및 응용 SW개발자 양성과정 일기' Related Articles

티스토리툴바