차근차근/JAVA Script 110

[Vue.js] Vue.js란 (1)

더보기 일단 나는..개발공백이 4년이 있는 백엔드 개발자이다. 서버나 디비를 만들고 운영도 했었지만 백엔드는 스프링이었고 화면단은 jsp였다. 공백기 동안 vue.js를 배웠는데..경험해봤는데.. 배운 그대로 비주얼 스튜디오를 설치하고 뷰티파이를 통해서만 개발을 해야 한다고 생각했었다. 다시 일을 하게 되었는데 jsp안에 vue가 있는 것을 보았다.. 왜 이 생각을 못했지..하는 생각과 동시에 내 공백이 너무 길었구나 하는 생각이 들었다.. 잠깐 찾아보니..jsp에서 vue를 쓰는 것조차 트랜드가 아니라고 말하고 있는 것 같다. 언제 따라 잡을 수 있을까.. vue.js 에 대해 정리를 하고 싶었는데. 이 블로그에 글을 쓸 때 자바스크립트 메뉴를 선택해야 하는건지 vue.js메뉴를 따로 만들어야 하는건지..

History API

if(typeof(history.pushState) == 'function'){ history.replaceState({}, null, location.pathname); } 새로나온 것도 아닌데..이제서야 처음봤다... - typeof 연산자는 피연산자의 평가 전 자료형을 나타내는 문자열을 반환합니다. 페이지를 리로드하지 않고 페이지 주소만 변경할 때 사용합니다. 앞서 말했듯이 html5 지원 브라우저에서만 사용 가능하기 때문에, 지원하지 않거나 ie10 미만 버전에서는 열심히 에러를 뿜어줄 것이다. 실제 페이지를 로드하는 것은 아니기 때문에 실제 문서 존재 여부는 중요하지 않다. 물론 새로고침 하면 페이지를 찾을 수 없다고 에러가 뿜뿜! 뒤로가기를 하면 원래 문서가 뜰 것입니다.(예제페이지) ajax..

화면 맨 위로 이동 + a태그에 js연결할 때 화면 맨 위로 이동x

원래 HTML 코딩할 때 주던 방식은 맨 위로 간단히 이렇게 했었다. 그러나, 저렇게 써 주면 접근성 오류는 물론이고 웹표준 프로그램 돌리면 링크 오류 뜬다.... 이 경우 주소의 제일 뒤에 #이 붙는다. http:/어쩌고../# < 이런식으로 이 # 기호는 추후 파라미터오류가 나는 경우가 있어서 비추!! 방법1 ] 맨 위로 위와 같이 하면 동작 잘된다. 그러나 위 방법으로 쓰는 것은 태그에 #기호를 쓰기 때문에 웹표준 오류다. 만약 이미지로 top 버튼을 준다면 아래와 같이 해보자 방법2 ] TOP div가 아니라 span이나 td 등을 사용해도 되고 cursor:pointer 는 마우스 커서를 손가락 모양으로 변경해 주는 스크립트 onclick 이벤트에 window.scrollTo 를 사용해서 (x,..

[Javascript] PC, MOBILE 구분하기 (Navigator 사용)

https://thingsthis.tistory.com/162 [Javascript] PC, MOBILE 구분하기 (Navigator 사용) 최근 개발 중 PC, MOBILE 을 구분하여 처리하는 로직에서 오류가 발생하였습니다. 결제 모듈을 호출하는 부분에서 PC 모듈을 호출해야 하지만 MOBILE 모듈을 호출하여 발생한 문제였습니다. 지금까지 thingsthis.tistory.com Win16 : 16비트 윈도위기반 컴퓨터 Win32 : 32비트 윈도위기반 컴퓨터 Win64 : 64비트 윈도위기반 컴퓨터 MacIntel : 인텔CPU 를 가진 매킨토시 컴퓨터 Mac : 매킨토시컴퓨터 var filter = "win16|win32|win64|mac|macintel"; var vWebType = ""; i..

JSON-P 사용하기

다른 도메인에 있는 결과 값을 읽어오려는데 이런 에러가 난다. Failed to load URL : No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.jquery.js:2 XHR finished loading: POST "URL". 기존에는 해당 사이트에 Access-Control-Allow-Origin설정을 했었는데..계속 사용을 해야 하는 부분인데 매번 각 사이트 마다 요청을 할 수는 없으니까.내가 다른 방법을 찾아야 했다. 그래서 찾은게 jsonp이다.. 사용방법은 ajax랑 비슷한데type은 GET..

일치하는 글자에 태크넣기..

졸려서 그랬나 쉬울 것 같았는데 시간이 너무 오래 걸렸다. 하려던 것은 김영숙 010-1111-1111김정희 010-2222-2222김미정 010-3333-3333 이렇게 있고 , 내가 만일 '김'으로 검색을 했다면 목록에서김영숙 010-1111-1111김정희 010-2222-2222김미정 010-3333-3333 이렇게 보이게. --------------------------------검색어가 '사과'이고 사과김영숙 010-1111-1111김사과정희 010-2222-2222김미사과정 010-3333-3333목록이 이렇게 있다면 사과김영숙 010-1111-1111김사과정희 010-2222-2222김미정사과 010-3333-3333이렇게 보이게. function SearchResult(returnValue..

네이버 지도 api v3 적용

정보 창 표시하기https://navermaps.github.io/maps.js/docs/tutorial-1-infowindow-simple.example.html 정보 창 표시하기정보창을 표시하는 기본 예제입니다. var HOME_PATH = window.HOME_PATH || '.'; var cityhall = new naver.maps.LatLng(37.5666805, 126.9784147), map = new naver.maps.Map('map', { center: cityhall.destinationPoint(0, 500), zoom: 10 }), marker = new naver.maps.Marker({ map: map, position: cityhall }); var contentString..

JavaScript Strings

http://www.w3schools.com/js/js_strings.asp JavaScript Strings« PreviousNext Chapter »JavaScript strings are used for storing and manipulating text.JavaScript StringsA JavaScript string simply stores a series of characters like "John Doe".A string can be any text inside quotes. You can use single or double quotes:문자열을 나타낼 때 , 작은 따옴표 , 큰 따옴표 둘다 사용가능.Examplevar carname = "Volvo XC60"; var carname =..

JavaScript Events

http://www.w3schools.com/js/js_events.asp JavaScript Events« PreviousNext Chapter »HTML events are "things" that happen to HTML elements.When JavaScript is used in HTML pages, JavaScript can "react" on these events.HTML EventsAn HTML event can be something the browser does, or something a user does.Here are some examples of HTML events:HTML 웹 페이지 로드 완료 시HTML 입력 필드 변경 시HTML 버튼을 클릭 시Often, when ev..

반응형