<head> 내부 <script><link> 중복
본문
안녕하세요. 제가 현재 PHP코드와 HTML코드를 함께 작성중인데요.
기존에 제가 작성 중인 코드는 다음과 같습니다. (첫번째 코드라 칭하겠습니다.)
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
문제없이 잘 사용중이었다가 jquery Timepicker를 이용하게 되어서 찾아보니 <head> 내부에 아래의 코드를 추가하라고 했습니다. (두번째 코드라 칭하겠습니다.)
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
</head>
https://wonpaper.tistory.com/179
제가 이 페이지를 보면서 jquery Timepicker를 사용중인데 head안에 첫번째 코드와 두번째 코드를 함께 적어주면 F12 눌렀을 때 아래 이미지와 같은 오류가 뜹니다.
그래서 head 안에 첫번째 코드(bootstrap)을 없애고 두번째 코드만 적어주면 jquery Timepicker는 잘 되는데 부트스트랩이 안됩니다.
그래서
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
/ajax.googleapis.com/ajax 이 중복되는 것 같아서 3.4.1 버전으로 한개만 적고, 나머지 합쳐주니
이런 오류가 뜨길래, 이번엔 2.2.0 버전으로 한개만 적고 나머지 합쳐주니 timepicker 인식을 못합니다..
혹시 방법이 있을까요?
답변 2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
이렇게 넣어도 이상 없는데요?
부트스트랩도 잘되고 timepicker도 잘되고요
헉 저는 말씀하신대로 해도 마지막 사진처럼 timepicker가 안먹히고 그냥 text로 보이네요..
구글링 해보니까 부트스트랩의 버전이 낮아서 그럴수도 있다고 하더라고요..
저는 부트스트랩을 그냥 <head> 파일 안에 작성하는거로만 알고있었는데 업그레이드를 해야한다 이런부분은 전혀 모르고 있어서요..
이것과 관계가 있을 수 있을까요?
https://mytest.iwinv.net/test1.html
이거 보시면 위에 두개 다 적용한거거든요...
부트스트랩은 공식사이트에 있는거 그냥 아무거나 붙인겁니다.
부트스트랩 버전이 낮긴 한데 이것도 오류나나요?
헉 아뇨.... 올려주신 링크에서는 부트스트랩과 timepicker가 잘 적용됐네요ㅠㅠㅠ
이거는 그러면 제 코드가 문제인거같네요...ㅠㅠ 테스트까지 해주시면서 도와주셔서 정말 감사합니다!!!
스크립트랑 css는 같은거 넣은거고 timepicker 코드는 링크에 있는거 넣은거고 부트스랩껀
공식사이트꺼 넣은거예요....
어디가 잘못된진 두개 비교해 보시면 될거 같네요 ^^
넵!!! 정말 감사합니다! 좋은 하루 되세요! ^_^
