Frontend

· Frontend
이번 포스팅에서는 vue js로 radio 버튼의 checked(selected) 값을 가져오는 방법에 대해서 알아보겠습니다. 클라이언트단에서 사용자가 라디오 버튼을 눌렀을때 어떤 값이 눌렸는지 다음과 같은 방식으로 알 수 있습니다. Vue Javascript var selected = event.target.value; 전체 코드를 보면 다음과 같습니다. 첫번째 두번째 세번재 vue의 @change를 사용해서 $event를 인자로 하여 함수를 호출합니다. 이 함수에서 event.target.value 를 하면 매우 간단하게 내가 클릭한 라디오 버튼의 값을 가져올 수 있습니다. 다음은 콘솔 창에 출력된 value 들입니다. Javscript 순수히 자바스크립트만 사용할 경우에는 다음과 같이 코드를 써주면..
· Frontend
Javascript로 현재 페이지를 새로고침 하는 법은 다음과 같이 세가지의 방법이 있습니다. //1 location.reload(true); //2 location.href = location.href; //3 history.go(0); 셋 중 아무거나 사용하시면 됩니다.
· Frontend
로컬에서 파일 다운로드를 구현하는데, 찾아보니 html a 태그의 download attribtue로 하는게 가장 간단하길래 다음과같이 쳐봤는데 계속 안됐다. DOWNLOAD 몇 시간 골머리를 썩다가 찾은 해결책! DOWNLOAD target="_self" 를 추가해주니 해결됐다.
· Frontend
Javascript나 jQeury를 사용해 script에서 radio button, check box의 checked속성을 바꾸는 법을 알아보겠습니다. 바로 코드를 보겠습니다. //jQuery $("#radioBtn").prop('checked', true); //체크 활성화 $("#radioBtn").prop('checked', false);//체크 비활성화 스크립트에서 위 처럼 DOM 객체를 선택한 뒤 .prop() 메소드를 사용해서 check 속성을 바꿔주면 됩니다. 아래는 간단한 예시입니다.
· Frontend
1. 사용자가 입력한 값 없애기(초기화 하기) 클릭하세요 값은 지워지고 초기 화면과 같이 placeholder가 정상적으로 뜨느 것을 확인할 수 있다. 2. 사용자가 입력한 값 바꾸기 클릭하세요 매우 잘 작동하는 것을 확인할 수 있다!
· Frontend
회사 코드에서 다음과 같이 선언된 함수들이 많아 궁금증이 생겨 포스팅을 하게 되었습니다. var variable = function(){ //function }; 구체적인 예시를 들어보겠습니다. functionOne() 과 functionTwo 에는 어떤 차이가 있을까요? var functionOne = function(){ console.log("Hello World!"); }; function functionTwo(){ console.log("Hello World!"); } 답은 다음과 같습니다. functionOne은 "function expression"이고 functionTwo는 "function declaration"이기 때문에 functionOne은 해당 줄이 실행되어야만 함수가 정의되고, ..
· Frontend
정규 표현식 정규 표현식(== 정규식)은 문자열에 나타나는 특정 문자 조합과 대응시키기 위해 사용되는 패턴입니다. 주로 문자열을 찾거나 replace 할 때 많이 쓰입니다. 전반적인 개념보다는 제가 찾아보다가 알게된 팁에서만 간단히 포스팅해보려 합니다. 정규식에 대해 제대로 공부하고싶으신 분들은 다음 사이트들을 참고해보세요. 1. MDN Web Docs - MDN 사이트이긴한데 영어로 보면 이해가 완벽하게 안돼서 한글로 보면 발번역이라,, 그래도 전체적인 내용이 다 정리돼있는 사이트입니다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions 정규 표현식 - JavaScript | MDN 정규 표현식은 문자열에 나타는..
· Frontend
오늘은 웹 페이지에 아이콘을 삽입하는 가장 쉬운 방법을 알아보겠습니다. Fontawesome에서 제공하는 CDN을 사용하는 방식인데, 바로 알아보도록 하죠. 1. HTML 파일의 8. 완료! 결과입니다. 오늘은 웹 페이지, 즉 html에 아이콘을 넣는 가장 쉽고 편리한 방법에 대해 알아보았습니다. 아이콘 png를 다운받는 것보다 훨씬 쉽고 간편한 방법이니, 한번쯤 사용해보시길 바랍니다.
rocher71
'Frontend' 카테고리의 글 목록 (2 Page)