Chrome 또는 IE를 사용하여 웹 페이지에서 정규 표현식을 검색하려면 어떻게해야합니까?


68

Chrome 또는 IE를 사용하여 웹 페이지에서 'foo | bar'와 같은 정규식을 검색하려면 어떻게해야합니까? "Regular Expression Searcher"확장명을 알고 있지만 작동하지 않습니다. (슬래쉬를 칠 때 아무 일도 일어나지 않습니다.) 웹 스토어의 리뷰에 따르면 이는 많은 사용자에게 일반적인 문제입니다.


1
Firefox를 사용하지는 않지만 추가 기능 중 하나가 흥미로울 수 있습니다. deeper web deeperweb.com RE를 수행하지는 않지만보다 세분화 된 검색을 지원합니다. 필사적 인 경우 항상 웹 페이지의 소스를 저장 한 다음 RE를 지원하는 유틸리티 또는 편집기를 사용하여 검색 할 수는 있지만 꽤 추악합니다.
Joe

웹 페이지의 외부 편집기로 NotePad ++를 사용할 수도 있습니다. 거기에서 정규 표현식을 검색 할 수 있습니다.
alfred

답변:


39

정규식과 일치시키기 위해 Javascript 사용

크롬 콘솔에서 시도해 볼 수도 있습니다.

var p=/.*(regu).+?\ /gi; console.log( document.body.innerText.match(p) );

콘솔을 열고 콘솔 에 복사하여 붙여 넣기 만하면 됩니다enter . 이 페이지에서 테스트 할 수 있습니다.
맞으면 개선 될 수 있습니다.

여기서는 콘솔 일치 색인과 일치하는 텍스트로 인쇄합니다. 여기서 우리는 regu20 문자 앞에 (또는 줄이 시작하면 더 적음) 10 문자 뒤에 (또는 eol이면 더 적음) 을 포함하는 텍스트를 일치 시킵니다.

var p=/.{0,20}regu[^ \n]+[^\n]{0,10}/gi;
while (m = p.exec(document.body.innerText)) { 
    console.log( 'Index: '+m.index+' Match: '+m ); }

또한 이것을 시도해보십시오 . 빨간색 페이지에 모든 일치하는 배경칠할 것입니다 . rexexp는 완벽하지는 않지만 적어도 HTML 태그를 엉망으로 해서는 안됩니다.

var p=/(\>{1}[^\n\<]*?)([^\n\<]{0,30}regu[^\n\<]{0,10})/gi,b=document.body;
b.innerHTML=b.innerHTML.replace(p,'$1<span style="background-color:red;">$2</span>');

이것을 북마크 :

이것을 사용하는 또 다른 방법은 javascript:프로토콜 을 사용하는 것입니다 (위와 동일한 코드).

javascript:(function(){var p=/(\>{1}[^\n\<]*?)([^\n\<]{0,30}regu[^\n\<]{0,10})/gi,b=document.body;b.innerHTML=b.innerHTML.replace(p,'$1<span style="background-color:red;">$2</span>');})();

예를 들어 javascript:프로토콜 1을 사용 하면 정규 표현식을 검색하기 위해 모든 웹 페이지에 작은 검색 상자를 삽입 할 수 있습니다.
간단한 정규 표현식을 사용하여 페이지에서 빨간색 일치 항목 을 제거 할 수도 있음을 이미 알고 있다고 생각합니다 .
몇 시간 동안 이것을 계속 개발하면 북마크에 맞는 검색 플러그인이있을 수 있습니다 :)


1
일부 이전 버전의 크롬은 지원하지 않습니다 innerText. innerText지원 여부를 확인 하고 사용할 수없는 textContent경우 기본값으로 설정하는 것이 좋습니다 innerText.
스펜서 D

요소를 찾기위한 초기 코드는 [...document.body.innerText.matchAll(p)]73+ 버전의 Chrome 코드와 함께 사용할 수 있습니다 .
Vadim Ovchinnikov

6

Chrome에서 정규 표현식 검색

정규식을 사용하여 웹 페이지를 검색 할 수있는 간단한 검색 유틸리티입니다.

개발중인 기능

  • 찾은 결과를 토글
  • 개선 된 UI
  • 대소 문자 구분 간 전환
  • 확장 기능을 전환하기위한 바로 가기 만들기
  • 검색 버튼을 클릭하는 대신 검색시 "Enter"키를 누르십시오

중요 참고 사항
이것은 페이지 액션 확장 프로그램이므로 이미 연 페이지에서 바로 작동하지 않습니다. 이 확장을 사용하기 전에 브라우저를 다시 시작하는 것이 좋습니다. 열린 페이지를 새로 고칠 수도 있습니다.


3
더 나은 제안은 없지만이 확장은 잘 작동하지 않습니다. 사용 설정되어있는 동안 AdBlock은 모든 광고를 차단하지 않습니다. 또한 예를 들어이 페이지를 검색 한 후에는 설명 추가 가 작동하지 않습니다.
Dennis

3
링크를 사용할 수 없습니다. Chrome 정규식 검색 과 동일한 확장 입니까?
Ruslan



1

Chrome 개발자 도구 모드에서 ctrl+ shift+를 입력합니다 F(Windows에서는 다른 OS에 대해서는 잘 모르겠습니다).

검색을위한 reg-ex 옵션이 있습니다. 모든 파일을 검색하므로 JavaScript 소스가 포함됩니다. HTML로만 제한 할 수 있는지 확실하지 않습니다.


1

macOS의 Chrome에서 Alt+ Command+ I를 길게 눌러 개발자 도구를 열고 "소스"탭 아래에서 페이지의 HTML 소스 코드를 선택한 다음 Command+ F를 길게 눌러 검색하고 .*(정규) 기호를 선택합니다 .

텍스트 만 검색해야하는 경우 pandoc 을 사용 하여 HTML을 일반 텍스트로 변환 할 수 있습니다 .

$ pandoc https://superuser.com/questions/417875 -t plain -o tmp.txt

그런 다음을 사용 less하여 정규식으로 검색 /하십시오.


0

실제로 검색은 아니지만이 정규 표현식 형광펜 (어딘가에 있음)이 매우 유용하다는 것을 알았으며 모든 브라우저에서 작동합니다.

javascript:(function(){var%20count=0,%20text,%20regexp;text=prompt(%22Search%20regexp:%22,%20%22%22);if(text==null%20||%20text.length==0)return;try{regexp=new%20RegExp(%22(%22%20+%20text%20+%22)%22,%20%22i%22);}catch(er){alert(%22Unable%20to%20create%20regular%20expression%20using%20text%20'%22+text+%22'.\n\n%22+er);return;}function%20searchWithinNode(node,%20re){var%20pos,%20skip,%20spannode,%20middlebit,%20endbit,%20middleclone;skip=0;if(%20node.nodeType==3%20){pos=node.data.search(re);if(pos%3E=0){spannode=document.createElement(%22SPAN%22);spannode.style.backgroundColor=%22yellow%22;middlebit=node.splitText(pos);endbit=middlebit.splitText(RegExp.$1.length);middleclone=middlebit.cloneNode(true);spannode.appendChild(middleclone);middlebit.parentNode.replaceChild(spannode,middlebit);++count;skip=1;}}else%20if(%20node.nodeType==1%20&&%20node.childNodes%20&&%20node.tagName.toUpperCase()!=%22SCRIPT%22%20&&%20node.tagName.toUpperCase!=%22STYLE%22){for%20(var%20child=0;%20child%20%3C%20node.childNodes.length;%20++child){child=child+searchWithinNode(node.childNodes[child],%20re);}}return%20skip;}window.status=%22Searching%20for%20%22+regexp+%22...%22;searchWithinNode(document.body,%20regexp);window.status=%22Found%20%22+count+%22%20match%22+(count==1?%22%22:%22es%22)+%22%20for%20%22+regexp+%22.%22;})();

모든 UUencoded 문자는 읽기가 어렵습니다. stackoverflow.com/questions/9280195/
Alok

1
이 사이트의 정규 표현식 형광펜을 사용하며 나에게 매우 효과적입니다. dpatrickcaldwell.blogspot.in/2010/09/…
사용자

나는 크롬 북 확장에서 사용하기 위해 일반적인 (북마크가 아닌) JS가 필요했고 @buffer link의 솔루션이 제대로 작동했습니다.
Evgeniy Dolzhenko

내가하기 전에 아래로 스크롤 했어야했는데 ... pastebin.com/VA9xvmM8
Sebi

0

Chrome 플러그인 을 제안 하고 싶습니다 .


나는 당신이 이것을 해결책으로 제안하고 있다고 생각하므로 그것을 편집했습니다. 또한 전체 링크를 표시하지 않고 링크를 제공 할 수 있습니다. 답변을 입력 할 때 표시되는 체인 링크 아이콘을 클릭하십시오.
KAE September

-1

URL 표시 줄에 넣으면 작동하지 않습니다. 그래도 멋질 것입니다.
Ahmed

또한 서식을 제거합니다 :(
Solomon Ucko

또한이 javascript:부분은 Chrome의 URL 표시 줄에 붙여 넣어지지 않습니다.
Solomon Ucko

1
이 곳의 DROP 테이블을 추가 만 남아 있어요 .. ;-))
Drakonoved
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.