본문 바로가기

Tried. Failed. Logged.

728x90

🖥️프론트엔드67

자바스크립트 - XPATH 문법으로 DOM ELEMENT 가져오기 XPATH 문법으로 단일 요소 가져오기 function getElementByXpath(path){ return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; } console.log( getElementByXpath("//html[1]/body[1]/div[1]")); XPATH 문법으로 다중 요소 가져오기 function getElementsByXPath(xpath, parent) { let results = []; let query = document.evaluate(xpath, parent || document, null, XPathResult.ORDERED_NODE.. 2023. 11. 12.

자바스크립트 - GET 파라미터 추출하기 let url = new URL("https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8&q=mdn%20query%20string") let params = new URLSearchParams(url.search); let sourceid = params.get('sourceid') // 'chrome-instant' let q = params.get('q') // 'mdn query string' let ie = params.has('ie') // true params.append('ping','pong') console.log(sourceid) console.log(q) console.log(ie) console.log(p.. 2023. 10. 26.

리액트 - 우클릭 메뉴 구현하기(context menu) https://blog.logrocket.com/creating-react-context-menu/ Creating a React context menu - LogRocket Blog Explore how to create a React context menu, the shortcuts to activate right-click menus, and how to create a custom context menu Hook. blog.logrocket.com // context menu const [clicked, setClicked] = useState(false); const [points, setPoints] = useState({ x: 0, y: 0 }); const [selectedTr, setSe.. 2023. 10. 13.

HTML - 티스토리 다크모드 토글 버튼 HTML 🌙 CSS /* 다크모드 */ .dark body{ background-color: #161618 !important; color: rgb(255, 255, 255) !important; font-weight: 700 !important; } 2023. 9. 30.

Jekyll - Github Pages에 jekyll theme deploy하기 1. 원하는 테마를 포크 한다. 2. 레포지토리 이름을 {내 깃허브아이디}.github.io로 지정한다. 3. 포크된 레포지토리의 Settings로 간다. 4. Pages에서 "Build and deployment" 항목의 Source를 "GitHub Actions"로 바꾼다. 5. 설정 파일을 만드는 선택이 나오므로 눌러서 jekyll.yml 설정 파일을 만든다. 6. 레포지토리의 Actions로 가서 Deploying 진행 과정을 기다린다. 7. 생성이 완료되었다면 {내 깃허브아이디}.github.io로 접속한다. 참고: https://www.youtube.com/shorts/Kq28yBigDYw 2023. 9. 25.

자바스크립트 - 자바스크립트 난독화 사이트(obfuscator.io) 사이트 주소 https://obfuscator.io/ JavaScript Obfuscator Tool JavaScript Obfuscator Tool A free and efficient obfuscator for JavaScript (including support of ES2022). Make your code harder to copy and prevent people from stealing your work. This tool is a Web UI to the excellent (and open source) javascript-obfuscato obfuscator.io // Paste your JavaScript code here function hi() { console.log("Hello .. 2023. 9. 5.

Jekyll - 깃허브 페이지 Jekyll ---layout: home # Index page--- 에러 해결 방법 .github/workflows/pages-deploy.yml ruby-version: 3.1 ruby-version을 3에서 3.1로 변경하고 branches를 master로 수정하니 해결이 된 것 같다. 또 안되면 3.1에서 3으로 수정하니깐 제대로 작동이 된다(?????????????) 출처: https://velog.io/@hashnsalt/Github-Blog-%EB%A7%8C%EB%93%A4%EA%B8%B0-2 📒Github Blog 만들기-2 22/08/01 7월 31일자 겪은 수 많은 오류가 서막이었음을 그땐 깨닫지 못했습니다 내 목표는 github로 기술 블로그를 개설하는 것. 선택한 테마는 Chirpy theme. velog.io 2023. 8. 31.

CSS - 인기 있는 디자인 프레임워크(Tailwind CSS) https://tailwindcss.com/ Tailwind CSS - Rapidly build modern websites without ever leaving your HTML. Tailwind CSS is a utility-first CSS framework for rapidly building modern websites without ever leaving your HTML. tailwindcss.com https://flowbite.com/ https://flowbite.com/ flowbite.com 2023. 8. 28.

CSS - 미디어쿼리 확인 사이트(mediaqueriestest.com) https://mediaqueriestest.com/CSS3 Media Queries Test on your browserCSS3 Media Queries is the heart of Responsive Design. This website will test all the features on your own browser, including screen dimensions, resolution and available extensions.mediaqueriestest.com 2023. 8. 28.

Expo - 웹뷰 ERR_CLEARTEXT_NOT_PERMITTED 에러 해결 방법 app.json "plugins": [ [ "expo-build-properties", { "android": { "usesCleartextTraffic": true } } ] ]"usesCleartextTraffic": true를 추가한다. 출처: https://docs.expo.dev/versions/latest/sdk/build-properties/ BuildPropertiesA config plugin that allows customizing native build properties during prebuild.docs.expo.dev 2023. 8. 15.

자바스크립트 - XPath 다루기, 반응속도 테스트 사이트 핵 만들기 XPath 선택자인 $x를 사용하는 방법도 있지만, setInterval 함수 내에 $x 선택자를 사용하려고 하면 VM3146:2 Uncaught ReferenceError: $x is not defined at :2:12 이라는 오류 메시지가 나온다. 그래서 evaluate 메서드를 이용해 XPath 표현식으로 특정 요소를 찾는 방법을 대신할 수 있다. evaluate 함수 구문 evaluate(xpathExpression, contextNode, namespaceResolver, resultType, result) 매개 변수 xpathExpression - XPath 표현식이 온다. contextNode - document 같은 context 노드가 입력된다. resultType - 결과 유형에 맞는.. 2023. 6. 23.

자바스크립트 - http를 https로 리다이렉트 if (window.location.protocol != "https:") { window.location.href = "https:" + window.location.href.substring(window.location.protocol.length); } if (document.location.protocol == 'http:') { document.location.href = document.location.href.replace('http:', 'https:'); } 출처: https://greendreamtrre.tistory.com/672 Javascript (자바스크립트) HTTP 접속 시 HTTPS로 리다이렉트 보통은 톰캣 서버 설정 등에서 자동으로 리다이렉트 시키도록 하지만 각 페이지마다.. 2023. 5. 18.

이전 1 2 3 4 ··· 6 다음

728x90

티스토리툴바