코딩18 개발자 도구에서 붙여넣기 안 될 때 해결하는 방법 크롬 개발자 도구개발자 도구에서 복사한 코드를 붙여넣으려고 하니 위와 같은 경고가 표시됩니다. 위와 같은 메시지가 출력되는 이유는 XSS(Cross Site Scripting) 공격을 방지하기 위함으로 개발자 도구에서 이해하지 못하거나 직접 확인하지 않은 코드를 붙여넣지 말라는 경고입니다. XSS 공격에 대한 게시물https://sungwoonl22.tistory.com/60 XSS 공격이란?XSS(Cross-Site Scripting, 크로스 사이트 스크립팅)란?XSS는 웹 애플리케이션의 취약점을 악용하여 사용자의 브라우저에 악성 스크립트를 실행시키는 공격입니다. 웹 애플리케이션은 사용자 입력을 받sungwoonl22.tistory.com 이를 해결하기 위해서는 콘솔에 allow pasting을 입력.. 2024. 11. 1. 자바스크립트 length로 문자열, 배열의 길이를 확인하는 방법 자바스크립트에서 length는 문자열과 배열의 크기를 확인하는 속성입니다. length는 데이터 구조의 크기를 간편하게 확인할 수 있기 때문에 다양한 작업에서 유용하게 사용할 수 있습니다. 특히, 문자열의 길이나 배열의 요소 개수를 쉽게 파악할 수 있어 데이터 처리 및 조건문 작성에 유용합니다. 배열에서의 lengthconst arr = [1, 2, 3, 4];console.log(arr.length); // 출력: 4배열의 length 속성은 배열에 포함된 요소의 개수를 나타냅니다. 자바스크립트 배열은 동적으로 크기가 변할 수 있기 때문에 length 값은 배열의 내용에 따라 자동으로 업데이트됩니다. 배열에서 length를 사용할 때 주의해야 할 사항const fruits = ['apple', 'ban.. 2024. 10. 5. 자바스크립트로 이름을 랜덤으로 뽑는 방법 자바스크립트를 사용해 배열에서 이름을 무작위로 뽑는 방법을 알아보겠습니다. 아래 이미지에 보이는 것처럼 간단한 구조로 되어 있으며 이름 뽑기 버튼을 누르면 랜덤으로 배열에 있는 이름이 화면에 출력됩니다. 우선 html 구조부터 만들어 보겠습니다. 위 이미지에 사용된 html 태그와 css입니다. css는 사용하지 않아도 기능에 영향을 미치지 않으므로 사용하지 않거나, 직접 스타일을 꾸며줘도 됩니다. html 랜덤 이름 뽑기 이름 뽑기 html 구조는 css에서 flex를 사용하기 위해 div로 감싸줬고 div 태그 안에 h2 태그, button 태그, p 태그가 들어있습니다. 여기서 button 태그를 클릭하면 랜덤 이름이 생성되어야 하므로 함수를 만들어 주겠습니다. 랜덤으로 이름을 생.. 2024. 6. 28. 반응형 웹 사이트를 구현하는 방법 반응형 웹은 하나의 웹 사이트에서 데스크톱, 스마트폰, 태블릿 등 다양한 디바이스로 접속할 때 디바이스 해상도에 맞는 화면을 보여주도록 하는 웹 디자인 기법 중 하나입니다. 스마트폰이나 태블릿 등이 보급되기 전의 웹 사이트들은 데스크톱 화면에 최적화되어 있어 스마트폰이나 태블릿으로 접속하면 사이트의 레이아웃이 깨지는 문제가 있었습니다. 반응형 웹은 다양한 기기에서 접속해도 최적화된 화면을 제공하기 위해 개발되었습니다. 미디어 쿼리 반응형 웹을 구현하기 위해서 CSS의 미디어 쿼리를 이용합니다. 미디어 쿼리는 웹페이지의 스타일을 다양한 기기와 화면 크기에 따라 조절할 수 있게 CSS에 도입된 기능입니다. 이를 통해 반응형 웹 디자인을 구현할 수 있습니다. 미디어 쿼리를 사용하면 다양한 해상도에서 스타일을 .. 2024. 1. 10. 이전 1 2 3 4 5 다음
