JavaScript를 배우기 위해 Bookmarklet의 제작을 추천했습니다.

개시하다

안녕하세요.나는 친구(IT업이 아닌)로부터 "JavaScript를 공부하고 있다. 어렵기 때문에 뭔가를 하고 싶다"고 말했다.그래서'북마크렛을 만들어 볼까'라는 제안을 했다.
오늘은 실존하는 이야기를 바탕으로 기사를 쓰려고 합니다.

북마크렛이 뭐야?

원래 책갈피는 WEB 사이트의 URL을 브라우저에 로그인해 원하는 시점에 로그인한 URL을 호출할 수 있는 기능을 말한다.이 일대는 평소에 인터넷을 사용하는 사람들이 잘 알고 있을 거라고 생각합니다.(이 기사를 봤을 때 이미 인터넷에 접속했기 때문에 묻지 않아도 된다고 썼는데 w)
이에 비해 책갈피지만 책갈피를 사용하는 기능은 변하지 않는다.다른 것은 URL 로그인 대신 JavaScript로 만든 프로그램입니다.책갈피의 경우 등록을 호출한 URL은 그곳으로 이동하고 책갈피 폴더는 등록을 실행하는 프로그램입니다.
그나저나 위키백과 선생님은 이렇게 말씀하셨어요.제 설명도 대충 있을 거예요.
책갈피 let은 사용자가 웹 브라우저의 책갈피 등에서 시작하여 특정한 처리를 하는 간단한 프로그램을 가리킨다.휴대전화의 웹 브라우저에서는 부족한 기능을 보충하거나 웹 응용 프로그램 처리를 시작하는 데 자주 쓰인다.

실제로 간단한 책갈피를 만들어 봤어요.

책갈피 모형

이런 느낌이에요.프로그램이 하고 싶은 일을 여기에 쓰세요.
초기 형태

javascript : (function() {
    //実行する処理内容
})();

예컨대

Qita에 쉽게 로그인할 수 있는 책갈피를 만들고 싶어요.아래 그림과 같이 바로 스크립트를 작성하십시오.※비밀번호가 가짜예요.
사용자 이름과 암호를 입력하는 프로그램

javascript : (function() {
  document.getElementById("identity").value = "tommy_aka_jps";
  document.getElementById("password").value = "yourpassword";
})();

이 작업을 수행하면 여기에 적힌 사용자 이름과 비밀번호가 Qita의 로그인 양식에 한꺼번에 입력됩니다.

줄 바꿈 및 들여쓰기를 한 줄로 변경

책갈피로 등록된 문자열이기 때문에 줄 바꾸기 문자를 넣으면 제대로 등록할 수 없습니다.그래서 나는 그것을 한 줄로 깎을 것이다.
줄 바꿈과 빈칸을 줄였습니다.

javascript:(function(){document.getElementById("identity").value="tommy_aka_jps";document.getElementById("password").value="yourpassword";})();

프로그램의 본문 자체는 아무런 변화가 없다.

책갈피 바로 등록해 볼게요.

화면은 Google Chrome입니다.일반 책갈피를 추가하는 것과 같은 절차입니다.URL 표시줄에 URL 대신 방금 만든 스크립트를 입력하는 것은 다릅니다.

등록 책갈피 실행

그래서 이렇게 됐어요.

필요한 모든 정보를 입력했습니다.이후 로그인 버튼을 누르기만 하면 됩니다.응, 편해.ID와 경로라면 브라우저가 기억하면 된다고 하면 안 되나요
로그인 버튼을 누르고 스크립트를 시킬 수 있지만 무슨 일이 일어났는지 알기 어려워 이번에는 설명용 샘플로 사용자 이름과 비밀번호를 입력했다.

사용 방법 정보

Document.getElementById() - Web API | MDN

JavaScript의 입문서에도 기재된 JavaScript로 HTML 조작을 하는 대중적인 방법이다.막 입문한 친구도 "아, 이거 며칠 전에 한 거야"라고 말했다.

감상

책갈피를 추천해 자바스크립트를 배우는 이유는 완성되기까지 시간이 오래 걸리지 않을 뿐만 아니라 간단한 프로그램으로 쉽게 조작할 수 있는 성공적인 체험도 실감할 수 있기 때문이다.
로그인 양식에 스크립트 값을 입력하는 것은 제가 예전에 처음 만든 책갈피입니다. DOM 조작을 처음 배운 초보자들에게는 쉽게 배울 수 있는 좋은 교재입니다.
여기서 제가 소개한 프로젝트는 정말 시작입니다. 책갈피에 관해서는 세계에서 많은 선인들이 남긴 좋은 소식과 각본이 있습니다.관심 있는 사람은 공부하는 틈이나 인터넷 서핑을 할 때 검색하는 김에 기분이 좋을 수도 있다.

참고 자료

북마크렛 같이 만들어요. - 큐타.

구글 크롬 책갈피 로그인 방법 - 책 횡단 검색 시스템

Create Bookmarklets - The Right Way

Bookmarklet - Wikipedia

어느 편이든 내 기사보다 더 두껍고 질 좋은 기사야 w 또는 위키백과에도 제작법이 실려 있어 웃었어 w