ฉันจะค้นหานิพจน์ทั่วไปภายในหน้าเว็บโดยใช้ Google Chrome หรือ IE ได้อย่างไร


68

ฉันจะค้นหานิพจน์ทั่วไปเช่น 'foo | bar' บนหน้าเว็บโดยใช้ Google Chrome หรือ IE ได้อย่างไร ฉันตระหนักถึงส่วนขยาย "Regular Expression Searcher" แต่มันไม่ได้ผลสำหรับฉัน (ไม่มีอะไรเกิดขึ้นเมื่อฉันกดทับ) บทวิจารณ์บนเว็บสโตร์ระบุว่านี่เป็นปัญหาที่พบบ่อยสำหรับผู้ใช้หลายคน


1
คุณไม่ได้ใช้ Firefox แต่คุณอาจพบว่าหนึ่งในแอดออนที่น่าสนใจ: เว็บที่ลึกกว่าเว็บ เราไม่ได้ทำREแต่มันช่วยการค้นหาที่ละเอียดยิ่งขึ้น หากคุณหมดหวังจริงๆคุณสามารถบันทึกแหล่งที่มาของหน้าเว็บได้ตลอดเวลาจากนั้นค้นหาด้วยเครื่องมือหรือตัวแก้ไขที่รองรับ REs แต่ก็น่าเกลียดอยู่ดี
โจ

อาจใช้ NotePad ++ เป็นเครื่องมือแก้ไขภายนอกสำหรับเว็บเพจ คุณสามารถค้นหา regexps
รด

คำตอบ:


39

การใช้ Javascript เพื่อจับคู่นิพจน์ทั่วไป

บางทีคุณอาจต้องการลองที่คอนโซลของ chrome:

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:โปรโตคอลหนึ่งสามารถแทรกช่องค้นหาเล็ก ๆ ลงในหน้าเว็บใดก็ได้เพื่อค้นหา regexp ของ
ฉันคิดว่าคุณรู้อยู่แล้วว่า regexp แบบง่ายสามารถใช้เพื่อลบการจับคู่สีแดงออกจากหน้า
หากฉันยังคงพัฒนามันต่อไปอีกสองสามชั่วโมงเราอาจมีปลั๊กอินค้นหาที่พอดีกับที่คั่นหน้า :)


1
innerTextบางรุ่นก่อนหน้าของโครเมี่ยมไม่สนับสนุน ขอแนะนำให้ตรวจสอบว่าinnerTextได้รับการสนับสนุนและเป็นค่าเริ่มต้นtextContentหากinnerTextไม่สามารถใช้งานได้
Spencer D

รหัสเริ่มต้นของคุณสำหรับการค้นหาองค์ประกอบสามารถอยู่ในรหัส[...document.body.innerText.matchAll(p)]สำหรับรุ่น 73+ ของ Chrome
Vadim Ovchinnikov

6

ค้นหานิพจน์ปกติจาก Google Chrome

ยูทิลิตี้การค้นหาอย่างง่ายที่ช่วยให้คุณค้นหาหน้าเว็บโดยใช้นิพจน์ทั่วไป

คุณสมบัติภายใต้การพัฒนา

  • สลับผ่านผลลัพธ์ที่ค้นพบ
  • UI ที่ได้รับการปรับปรุง
  • สลับระหว่างความไวตัวพิมพ์ใหญ่และตัวพิมพ์เล็ก
  • สร้างทางลัดสำหรับสลับส่วนขยาย
  • อนุญาตให้กดปุ่ม "Enter" เมื่อค้นหา (แทนที่จะคลิกที่ปุ่มค้นหา)

หมายเหตุสำคัญ
นี่เป็นส่วนขยายการกระทำของหน้าซึ่งจะไม่ทำงานในหน้าที่คุณได้เปิดไว้ทันที ฉันแนะนำให้รีสตาร์ทเบราว์เซอร์ของคุณก่อนเริ่มใช้ส่วนขยายนี้ คุณสามารถลองรีเฟรชหน้าที่เปิดอยู่


3
ฉันไม่มีข้อเสนอแนะที่ดีกว่า แต่ส่วนขยายนี้ทำงานได้ไม่ดีนัก ในขณะที่เปิดใช้งาน AdBlock จะไม่ปิดกั้นโฆษณาทั้งหมด นอกจากนี้หลังจากค้นหาหน้านี้เช่นความคิดเห็นเพิ่มหยุดทำงาน
เดนนิส

3
ลิงค์ไม่สามารถใช้งานได้ มันเป็นส่วนขยายเดียวกันกับการค้นหาของ Chrome Regexหรือไม่
Ruslan

4

ส่วนขยายการค้นหา + มีความเห็นที่ดีและยังไม่ได้กล่าวถึง: https://chrome.google.com/webstore/detail/find%20-regex-find-in-page/fddffkdncgkkdjobemgbpojjeffmmofb?hl=th-US

ฉันลองใช้และใช้งานได้ดีและมี UI ที่ชัดเจนและเรียบง่าย

มันสามารถค้นหาข้อความข้ามองค์ประกอบ HTML คนอื่น ๆ ที่ฉันพยายามไม่สามารถทำได้

ป้อนคำอธิบายรูปภาพที่นี่


3

ส่วนขยายอื่น ๆ ที่กล่าวถึงใช้งานไม่ได้สำหรับฉันดังนั้นฉันจึงเขียนส่วนขยาย chrome โอเพนซอร์สของตัวเองที่คุณสามารถลองใช้ได้ที่นี่: https://chrome.google.com/webstore/detail/regex-search/bcdabfmndggphffkchfdcekcokmbnkjl?hl = th & GL = สหรัฐ

ซอร์สโค้ดมีอยู่ใน github: https://github.com/gsingh93/regex-search


1

ในโหมดเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ให้พิมพ์ctrl+ shift+ F(ใน Windows ไม่แน่ใจเกี่ยวกับระบบปฏิบัติการอื่น)

มีตัวเลือก reg-ex สำหรับการค้นหา นี่จะค้นหาไฟล์ทั้งหมดดังนั้นจึงจะมีแหล่งที่มาของ JavaScript ฉันไม่แน่ใจว่าคุณจะ จำกัด ได้เพียง HTML เท่านั้น


1

ใน Chrome บน MacOS ถือAlt+ Command+ Iเพื่อเปิดเครื่องมือสำหรับนักพัฒนาเลือกซอร์สโค้ด HTML สำหรับหน้าเว็บ (ภายใต้แท็บ "แหล่งที่มา") ถือCommand+ Fเพื่อค้นหาและเลือก.*(Regex) สัญลักษณ์

หากคุณต้องการค้นหาเฉพาะข้อความคุณสามารถใช้pandocเพื่อแปลง HTML เป็นข้อความธรรมดา:

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

จากนั้นใช้lessเพื่อค้นหาด้วย Regex (ค้นหาด้วย/)


0

ไม่ใช่การค้นหา แต่ฉันพบว่าเครื่องมือเน้นข้อความ regexp (ที่ฉันพบที่ไหนสักแห่ง) ค่อนข้างมีประโยชน์และใช้ได้กับเบราว์เซอร์ทั้งหมด

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 ทั้งหมดทำให้อ่านยากฉันพบสิ่งที่ดูเหมือนว่าเป็นรุ่น multiline ที่stackoverflow.com/questions/9280195/ …
Alok

1
ฉันใช้เครื่องมือเน้นข้อความ regexp จากเว็บไซต์นี้และใช้งานได้ดีสำหรับฉันdpatrickcaldwell.blogspot.in/2010/09/…
ผู้ใช้

ผมจำเป็นต้องมีปกติ (ไม่ bookmarklet) JS (สำหรับการใช้งานในส่วนขยายของ Chrome) และวิธีการแก้ปัญหาจากการเชื่อมโยง @buffer ทำงานดี
Evgeniy Dolzhenko

ฉันควรเลื่อนลงก่อนที่จะทำเอง ... pastebin.com/VA9xvmM8
Sebi

0

ผมอยากจะแนะนำนี้ปลั๊กอิน Chrome


ฉันคิดว่าคุณกำลังแนะนำสิ่งนี้เป็นวิธีแก้ปัญหาดังนั้นฉันจึงแก้ไขมัน นอกจากนี้คุณสามารถให้ลิงค์โดยไม่แสดงลิงค์แบบเต็ม คุณคลิกที่ไอคอนการเชื่อมโยงโซ่ซึ่งจะปรากฏเมื่อคุณพิมพ์คำตอบของคุณ
KAE

-1
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.