728x90 반응형 JavaScript12 배열 document.getElementById("btn1").addEventListener("click",function(){ //배열 선언 방법 const arr1 = new Array(3);//3칸짜리 배열 생성 const arr2 = new Array(); //0칸짜리 배열 생성 // console.log(arr1); // console.log(arr2); // 다른 자료형 대입 arr1[0]= "크로칸슈"; arr1[1]= 4500; arr1[2] = true; console.log(arr1); //0칸 배열에 대입 -> 자동으로 길이 증가 arr2[0] = "피자"; arr2[1] = 7800; arr2[2] = false;.. 2024. 6. 18. 문자열 숫자형 변환 document.getElementById("btn1").addEventListener("click",function(){ // 문자열.indexof(""); //문자열에서 "str"과 일치하는 부분이 시작되는 인덱스를 반환 //없으면 -1 반환 const str1 = "Hellow word"; console.log(str1.indexOf("e")); //1 console.log(str1.indexOf("1")); //2 가장 먼저 검색된 인덱스 반환 console.log(str1.indexOf("A")); //-1 //문자열.substring(시작인덱스, 종료인덱스) : 문자열 일부 잘라내기 // -시작 이상 종료 미만 const str2="abcd.. 2024. 6. 18. 자바스크립트 js 이벤트 //인라인 이벤트 모델 확인하기function test1(button){ // console.log(button) button.style.backgroundColor="red"; button.style.color= "white";}//고전 이벤트 모델 확인하기console.log(document.getElementById("test2-1"));document.getElementById("test2-1").onclick = function(){ //익명 함수(이벤트 핸들러에 많이 사용함) alert("고전 이벤트 모델 확인");}//이벤트 제거document.getElementById("test2-2").onclick = function(){ //test2-1 이벤트 제거 .. 2024. 6. 14. 요소 접근 방법 js// id로 접근하기function accessId(){ const div1 = document.getElementById("div1"); //접근한 요소의 배경색 얻어오기 const bgColor = div1.style.backgroundColor; // **** 자바스크립트는 문자열 비교시에도 비교 연산자를 사용!!! *** if(bgColor == "red"){ div1.style.backgroundColor="yellow"; // div1의 배경색을 yellow로 변경 }else{ div1.style.backgroundColor="red"; }}// class로 접근하기function accessClass.. 2024. 6. 13. 데이터 입출력 javascriptfunction btnAlert(){ window.alert("alert 버튼 클릭 됨"); // window는 브라우저 자체를 나타내는 객체 // -> JS 코드는 브라우저(window) 내부에서 실행되는 코드이다보니 // window를 생략할 수 있다.}// document.write 확인function documentWrite(){ // document.write("내용"); //document.write("이제 곧쉬는 시간"); // 출력할 문구에 html 태그가 있을 경우 해석해서 시각적인 요소로 보여짐 let a = ""; a += ""; a += "1"; a += "2"; a += ""; document.write(a);}// in.. 2024. 6. 13. javascript 개요 js.// 한줄 주석/* 범위주석 *///js 파일은 태그 내부라고 생각function btnClick2(){ window.alert("external 알림창 추력 버튼!");}function changeColor1(){ document.getElementById("box").style.backgroundColor = "red";}function changeColor2(){ document.getElementById("box").style.backgroundColor ="yellow";} html.DOCTYPE html>html lang="en">head> meta charset="UTF-8"> meta name="viewport" content="width=device-wid.. 2024. 6. 12. 이전 1 2 다음 728x90 반응형