JavaScript는 시차를 어떻게 계산합니까(외부 글꼴 파일 도입)?

青灯夜游
풀어 주다: 2018-09-13 17:14:41
원래의
1756명이 탐색했습니다.

이 장에서는 JavaScript를 사용하여 시차를 계산하는 방법(외부 글꼴 파일 소개)을 보여줍니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

JavaScript Date() 개체:

new Date(): 현재 시간을 초기 값으로 사용하는 시간 개체

setFullYear(): 월을 설정하는 데 사용되며 세 가지 매개 변수를 가질 수 있습니다. setFullYear(연,월,일);

 setHours(): 지정된 시간의 시간을 설정합니다. 4개의 매개변수가 있을 수 있습니다. setHours(hour,min,sec,millisec);

 getDate(): 특정 날짜를 반환합니다. of the Month;

 getMonth(): 월을 나타내는 숫자를 반환합니다.

 getFullYear(): 연도를 나타내는 4자리 숫자를 반환합니다.

 getTime(): 1970년 1월 1일 이후의 밀리초 수를 반환합니다.

 setFullYear(): 연도 설정

  setDate(): 날짜 설정

코드 예:

CSS 코드:

@font-face{
            font-family: "Digital-7 Mono";
            src: url('Digital-7Mono.TTF');
        }
        div{
            width: 500px;
        } 
       .contain{
            text-align: right;
            font-size: 18px;
            margin-top: 10px;
            margin-bottom: 10px;
        }
        .contain span{
            font-family: "Digital-7 Mono";
            font-size: 36px;
            color: #555;
            padding-left: 10px;
        }
로그인 후 복사

HTML 코드:

<div class="contain"></div>
로그인 후 복사

js 코드:

<script src="jquery.min.js"></script>
<script type="text/javascript">
    var displayMode = 1;
    var time;

    $(".contain").click(function(){
        displayMode *= -1;
        Time(time, displayMode);
    });

    // 返回不同月份不同天数的方法
    function getDaysInMonth(month) {
        var data = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
        return data[month];
    }

    // 设置开始时间
    function start(year,month,day,hour,min,sec,mill){
        var starttime =new Date();
        starttime.setFullYear(year,month-1,day);
        starttime.setHours(hour,min,sec,mill);
        time =starttime;
        return time;
    }
    start(2015,2,20,21,0,0,0);
    
    function Time(date,mode){
        var years = NaN;
        var months = NaN;

        var current =new Date();
        var seconds =(Date.parse(current) - Date.parse(date)) /1000; //获取时间差的秒数
        var days =Math.floor(seconds / (3600 * 24)); //总天数

        seconds = seconds % (3600 * 24);  //总秒数 % 一天的秒数 下面的同理
        var hours =Math.floor(seconds / 3600); 

        seconds = seconds % 3600;
        var minutes = Math.floor(seconds / 60);

        seconds = seconds % 60;

        // 判断假如时分秒小时10的话 前面加0
        (seconds <10)? seconds ="0"+seconds:seconds=seconds;
        (hours <10)? hours ="0"+hours:hours=hours;
        (minutes <10)? minutes ="0"+minutes:minutes=minutes;

        if (mode == 1) {
            days = current.getDate() - date.getDate(); //当前日 - 开始日
            if (days < 0) {
                days += getDaysInMonth(current.getMonth());
                current.setDate(current.getDate() -1);
            }
            months = current.getMonth() - date.getMonth();
            if (months < 0) {
                months += 12;
                current.setFullYear(current.getFullYear() - 1);
            }
            years = current.getFullYear() - date.getFullYear();
        } else {
            days = Math.floor((current.getTime() - date.getTime()) / (1000 * 3600 * 24));
        }

        var result = (years > 0 ? "<span class=&#39;years&#39;>" + years + "</span> year ":"")
            result += (months >= 0 ? "<span class=&#39;months&#39;>" + months + "</span> month ":"");
            result += "<span class=&#39;days&#39;>" + days + "</span> day ";
            result += "<span class=&#39;hours&#39;>" + hours + "</span> hr "
            result += "<span class=&#39;minutes&#39;>" + minutes + "</span> min "
            result += "<span class=&#39;seconds&#39;>" + seconds + "</span> sec"

        $(".contain").html(result);
    }
    Time(time,displayMode);
    
    setInterval(function(){
        Time(time,displayMode);
    },1000)
</script>
로그인 후 복사

로컬에 설치할 필요 없이 외부 글꼴 파일을 직접 참조하세요.

@font-face{
            font-family: "Digital-7 Mono";
            src: url(&#39;Digital-7Mono.TTF&#39;);
        }
로그인 후 복사

URL은 파일 경로입니다

위 내용은 JavaScript는 시차를 어떻게 계산합니까(외부 글꼴 파일 도입)?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿