JAWS-UG CLI 전문 지부 즐겁지요. 아시는 분은 종합 안내 당 참조해 보세요.

이 단계를 수행할 때 웹에서 CLI 명령을 복사할 수 있지만, 여기서 선택을 잘못하여 명령 오류가 발생하면 조금 슬프다. 손가락이 민첩하지 않기 때문에 가끔 있어요 w

그렇다고 해서, 자신용의 퀵 해크로서 「CLI 커멘드를 원 클릭으로 전 선택하는 JavaScript 코드」를 써 보았습니다. 북마크 쓰는 건 몇 년 흔들 것이다 ...

JavaScript 코드

대상 페이지 를 보면, CLI 코드가 기재되어 있는 HTML Element 는 이하의 4 종류의 CSS 셀렉터로 선택할 수 있을 것 같습니다.

pre.command

pre.setenv

pre.checkenv

.highlight-sh .highlight

그렇다면 코드는 간단하고 HTML 요소를 선택하고 onClick 이벤트를 넣으면 ok. 예를 들면 다음과 같습니다.

document.querySelectorAll("pre.command, pre.setenv, pre.checkenv, .highlight-sh .highlight").forEach(e => {
  e.addEventListener('click', function(){
    var r = document.createRange();
    r.selectNodeContents(this);
    var sel = window.getSelection();
    sel.removeAllRanges();
    sel.addRange(r);
  });
});

JAWS-UG CLI 절차 페이지에서 콘솔을 열고 위의 코드를 복사하여 실행하면 CLI 코드를 한 번의 클릭으로 선택할 수 있습니다.

나머지는 Ctrl-C Ctrl-V 등으로 콘솔에 복사하면 ok.

일단 Chrome과 Firefox 브라우저에서 동작을 확인하고 있습니다.

북마크릿화 해보기

매번 웹 브라우저의 콘솔에서 실행하는 것도 번거롭기 때문에 북마크릿으로 해 둡시다. 클릭 한 번으로 기능을 사용할 수 있습니다.

Chrome의 경우, 먼저 북마크하고 제목(이름)을 입력합니다.

기타를 클릭하여 고급 설정 화면으로 이동합니다.

다음 코드를 URL 필드에 설정하면 ok입니다.

javascript:document.querySelectorAll("pre.command, pre.setenv, pre.checkenv, .highlight-sh .highlight").forEach(e => {e.addEventListener('click', function(){var r = document.createRange();r.selectNodeContents(this);var sel = window.getSelection();sel.removeAllRanges();sel.addRange(r);});});

이후 단계 페이지에서 작성한 북마크릿을 클릭하면 한 번의 클릭으로 CLI 코드 선택을 사용할 수 있습니다.

이제 단계를 가속화하고 더 많은 잡담 채팅에 참여하세요.