Hướng dẫn regex check for html tags - kiểm tra regex cho các thẻ html

Tôi muốn đưa ra biểu thức thông thường để trả về đúng nếu thẻ HTML đóng được khớp với một biểu thức mở trong văn bản cụ thể được truyền trong JavaScript. Nếu có một thẻ chưa từng có, nó sẽ trả về sai;

Ví dụ: nếu văn bản sau được thông qua "<div>Test</div>", nó sẽ trả về true nhưng nếu văn bản sau được truyền

Tôi chỉ có thể lấy nó để khớp với các thẻ div đầu tiên để trả về true với biểu thức sau

    var text = "<div>Test</div>; 
    var text2 = "<div>Test</div><div>; 
    var regex = /[^<>]*<(\w+)(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)>[^<>]*<\/\1+\s*>[^<>]*|[^<>]*<\w+(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/>[^<>]*|<!--.*?-->|^[^<>]+$/;
    var match = regex.test(text);
    console.log(match); // true
    var match = regex.test(text2);
    console.log(match2); // still true should be false

Làm thế nào tôi có thể sửa nó để nó hoạt động theo cách tôi muốn.

hỏi ngày 16 tháng 1 năm 2014 lúc 2:39Jan 16, 2014 at 2:39

7

Phương thức test trả về đúng cho match2 vì nó đã tìm thấy một trận đấu.it has found a match.

Để khắc phục nó, hãy thay đổi Regex của bạn theo cách này:

^(?:<(\w+)(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)>[^<>]*<\/\1+\s*>|<\w+(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/>|<!--.*?-->|[^<>]+)*$

Mô tả (Bấm để phóng to)

Thử nghiệm

http://jsfiddle.net/r2LsN/

Thảo luận

Regex xác định tất cả các mẫu được phép trước:

1. Tags with body: <tag>...</tag>
2. Tags không có cơ thể: <tag/> (ở đây chúng ta có thể tìm thấy khoảng cách hoặc nhiều hơn trước /)
3. Nhận xét <!-- ... -->
4. Bất kỳ văn bản nào không phải là ____10 hoặc

   ^(?:<(\w+)(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)>[^<>]*<\/\1+\s*>|<\w+(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/>|<!--.*?-->|[^<>]+)*$
   

   1.

Sau đó, các mẫu này có thể xuất hiện bằng 0 hoặc nhiều lần giữa đầu và phần cuối của chuỗi được thử nghiệm:

^(?:<(\w+)(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)>[^<>]*<\/\1+\s*>|<\w+(?:(?:\s+\w+(?:\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/>|<!--.*?-->|[^<>]+)*$

Đã trả lời ngày 20 tháng 1 năm 2014 lúc 12:10Jan 20, 2014 at 12:10

StephanstephanStephan

40.6K61 Huy hiệu vàng233 Huy hiệu bạc321 Huy hiệu đồng61 gold badges233 silver badges321 bronze badges

6

Đầu tiên, tải dịch vụ xác thực đánh dấu trong một tab Trình duyệt, nếu nó chưa mở. Chuyển sang xác thực bằng tab đầu vào trực tiếp. Sao chép tất cả các mã của tài liệu mẫu (không chỉ cơ thể) và dán nó vào khu vực văn bản lớn được hiển thị trong dịch vụ xác thực đánh dấu. Nhấn nút Kiểm tra.

Nếu bạn đã xử lý dữ liệu dựa trên văn bản trước đây, bạn có thể không xa lạ gì với cách một bộ dữ liệu lộn xộn có thể khiến cuộc sống của bạn khốn khổ. Thực tế là hầu hết các dữ liệu của thế giới có dạng phi cấu trúc là một sự thật xấu xí được biết đến sớm hay muộn. Trong bài đăng này, chúng tôi sẽ nói về Regex (biểu thức thông thường) là gì, bạn có thể làm gì với Regex và một số ví dụ cụ thể với công cụ Regex miễn phí.

Biểu thức chính quy (Regex) là gì

Một biểu thức chính quy (đôi khi được gọi là biểu thức hợp lý) là một chuỗi các ký tự xác định mẫu tìm kiếm, chủ yếu để sử dụng trong khớp mẫu với các chuỗi hoặc khớp chuỗi, tức là "Tìm và thay thế các thao tác giống như". Khái niệm này nảy sinh vào những năm 1950, khi nhà toán học người Mỹ Stephen Kleene chính thức hóa mô tả ngôn ngữ thông thường và được sử dụng phổ biến với tiện ích xử lý văn bản UNIX ED (một trình soạn thảo dòng cho hệ điều hành UNIX), một biên tập viên và Grep . Đây là một đoạn trích từ Wikipedia được sử dụng để xác định biểu thức chính quy.

Nghe có vẻ mơ hồ, khái niệm này thực sự khá dễ hiểu. Nói rằng bạn muốn tìm một bộ phim nhất định trên Netflix, có lẽ bạn sẽ tìm kiếm với tiêu đề của bộ phim hoặc thậm chí là một phần của tiêu đề. Công cụ tìm kiếm của Netflix sau đó sẽ tiếp tục tìm kiếm bất kỳ bộ phim nào với các tiêu đề phù hợp với những gì bạn đã nhập vào hộp tìm kiếm và hiển thị cho bạn một danh sách các kết quả tìm kiếm phù hợp với từ khóa tìm kiếm của bạn. Tương tự như vậy, các biểu thức chính quy giống như những từ bạn đã sử dụng để tìm kiếm bộ phim mà bạn muốn tìm.

Về cơ bản, các biểu thức chính quy là các mẫu văn bản mà bạn có thể sử dụng để phù hợp với các phần tử hoặc thay thế các phần tử trong suốt các chuỗi văn bản. Regex có thể mạnh hơn bạn nghĩ vì nó cực kỳ linh hoạt đối với việc làm sạch dữ liệu dựa trên văn bản.

Bạn có thể làm gì với Regex

Nói tóm lại, các biểu thức thông thường có thể được sử dụng để khớp các thẻ HTML và trích xuất dữ liệu trong các tài liệu HTML.

Các trường hợp sử dụng regex thông thường

• Sử dụng regex để trích xuất email
• Sử dụng regex để trích xuất số điện thoại
• Tinh chỉnh dữ liệu được trích xuất (thay thế nội dung, thêm tiền tố, ..)

HTML thực tế được tạo thành từ các chuỗi, và điều làm cho biểu thức chính quy trở nên mạnh mẽ là, một biểu thức thông thường có thể phù hợp với các chuỗi khác nhau. Phải thừa nhận rằng, sử dụng các biểu thức thông thường để phân tích cú pháp HTML thường có thể dẫn đến những sai lầm như bỏ lỡ các thẻ đóng, không khớp một số thẻ, v.v ... Các lập trình viên có nhiều khả năng sử dụng các trình phân tích HTML khác như Phpquery, BeautifulSoup, HTML5Lib-Python, v.v. Nhanh chóng khớp các thẻ HTML, bạn có thể sử dụng công cụ cực kỳ thuận tiện này để xác định các mẫu trong các tài liệu HTML. Mỗi lập trình viên hoặc bất kỳ ai muốn trích xuất dữ liệu web đều được khuyến nghị mạnh mẽ để tìm hiểu về các biểu thức thông thường về cách công cụ này có thể cải thiện đáng kể hiệu quả và năng suất công việc.

Chúng ta hãy xem một vài ví dụ về các biểu thức thông thường để khớp với các thẻ HTML.examples of regular expressions to match HTML tags.

• Biểu thức thông thường để khớp thẻ HTML:

.? |]>.? |
<(\S*?)[^>]>.?|<.*?/>

• Biểu thức thông thường để khớp & nbsp; tất cả TD & NBSP; TAGS:

\S*.*

• Biểu thức chính quy để phù hợp & nbsp ;:

<[a-zA-Z]+(\s+[a-zA-Z]+\s*=\s*("([^"])"|'([^'])'))\s/>

Chúng ta có thể khớp một loạt các thẻ HTML bằng cách sử dụng biểu thức thông thường như vậy và do đó dễ dàng trích xuất dữ liệu trong các tài liệu HTML.

Bạn cũng có thể kiểm tra bảng cheat biểu thức thông thường này để có một tài liệu tham khảo nhanh cho Regex.

Ngoài ra, đây là một số công cụ thử nghiệm và gỡ lỗi trực tuyến phổ biến để giúp tạo hoặc xác minh đúng các biểu thức:

• REGEX TESTER
• Regex 101: Xây dựng, kiểm tra và gỡ lỗi Regex
• Regexr: Tìm hiểu, xây dựng và kiểm tra Regex

Nếu bạn cần cạo và định dạng lại dữ liệu web cùng một lúc, hãy tải xuống Octoparse, đây là một công cụ Regex miễn phí đã sẵn sàng để sử dụng. Chỉ cần mở phần mềm và nhấp vào biểu tượng "Công cụ" trên menu bên lề.

Công cụ Regex miễn phí -& NBSP; Octoparse

Octopars là một công cụ cạo web không mã hóa. Với nó, bạn có thể sử dụng Regex để khớp/thay thế các ký tự trong một giá trị trường để tinh chỉnh dữ liệu được trích xuất trực tiếp. is a no-coding web scraping tool. With it, you can use RegEx to match out/replace characters in a field value to refine the extracted data directly.

Công cụ Octopars Regex là một công cụ tích hợp cung cấp một cách tiện dụng để tạo các biểu thức thường xuyên tự động bằng cách thiết lập các tiêu chí khác nhau. Khi biết rất ít về cách tạo cú pháp biểu thức thông thường, công cụ Regex sẽ đặc biệt hữu ích.

Trong Octoparse, có hai cách để truy cập vào công cụ Regex:

Phương pháp 1: Trong các tùy chọn dữ liệu sạch của Octoparse

• Chọn trường dữ liệu bạn muốn tùy chỉnh
• Nhấp vào "..." và chọn "Dữ liệu sạch"
• Nhấp vào "Thêm bước"
• Chọn "Thay thế bằng biểu thức chính quy"/"khớp với biểu thức thông thường" & nbsp;Replace with Regular Expression"/"Match with regular expression" 
• Nhấp vào "Không chắc chắn về Regex? Hãy thử công cụ Regex!"Not sure about RegEx? Try the RegEx tool!"

Phương pháp 2: Từ điều hướng thanh bên

• Chọn biểu tượng "Hộp công cụ" từ dưới cùng của điều hướng thanh bên
• Nhấp vào "Công cụ Regex"

Trong 2 trường hợp sau đây, bạn sẽ tìm ra cách Regex Tool hoạt động trong Octoparse.

Trường hợp 1: Sử dụng các ký tự gần đó để định vị văn bản

Nếu bạn muốn lấy thông tin xếp hạng từ HTML bên dưới, bạn có thể sử dụng công cụ Regex của Octopars để phù hợp với các yếu tố bằng cách sử dụng các ký tự "Bắt đầu với" và "kết thúc với" gần đó.

Chúng ta có thể khớp một loạt các thẻ HTML bằng cách sử dụng biểu thức thông thường như vậy và do đó dễ dàng trích xuất dữ liệu trong các tài liệu HTML.

Chúng ta có thể khớp một loạt các thẻ HTML bằng cách sử dụng biểu thức thông thường như vậy và do đó dễ dàng trích xuất dữ liệu trong các tài liệu HTML.

([a-zA-Z0-9_.-]@[a-zA-Z0-9_.-])

Bạn cũng có thể kiểm tra bảng cheat biểu thức thông thường này để có một tài liệu tham khảo nhanh cho Regex.

Ngoài ra, đây là một số công cụ thử nghiệm và gỡ lỗi trực tuyến phổ biến để giúp tạo hoặc xác minh đúng các biểu thức:

REGEX TESTER

Tôi có thể sử dụng regex trong html không?

Mặc dù HTML tùy ý chỉ có một regex là không thể, nhưng đôi khi nó thích hợp để sử dụng chúng để phân tích một bộ HTML hạn chế, được biết đến. Nếu bạn có một tập hợp nhỏ các trang HTML mà bạn muốn cạo dữ liệu và sau đó đặt vào cơ sở dữ liệu, Regexes có thể hoạt động tốt.arbitrary HTML with only a regex is impossible, it's sometimes appropriate to use them for parsing a limited, known set of HTML. If you have a small set of HTML pages that you want to scrape data from and then stuff into a database, regexes might work fine.

Làm cách nào để kiểm tra xem HTML có hợp lệ không?

World Wide Web Consortium cung cấp một công cụ trực tuyến đơn giản (https://validator.w3.org/) tự động kiểm tra mã HTML của bạn và chỉ ra bất kỳ vấn đề/lỗi nào mà mã của bạn có thể có, chẳng hạn như thiếu thẻ đóng hoặc thiếu trích dẫn xung quanh các thuộc tính.https://validator.w3.org/) that automatically check your HTML code and point out any problems/errors your code might have, such as missing closing tags or missing quotes around attributes.

Kiểm tra Regex là gì?

Bộ xử lý kiểm tra Regex kiểm tra dữ liệu trong một thuộc tính dựa trên danh sách tham chiếu của các biểu thức chính quy hợp lệ và không hợp lệ cho thuộc tính.Nó lấy chuỗi, nhiều chuỗi hoặc mảng chuỗi làm đầu vào.checks the data in an attribute against reference lists of valid and invalid regular expressions for the attribute. It takes string, multiple strings, or string array as an input.

Làm cách nào để tìm một phần tử HTML hợp lệ bên trong một tài liệu HTML lớn?

Đầu tiên, tải dịch vụ xác thực đánh dấu trong một tab Trình duyệt, nếu nó chưa mở.Chuyển sang xác thực bằng tab đầu vào trực tiếp.Sao chép tất cả các mã của tài liệu mẫu (không chỉ cơ thể) và dán nó vào khu vực văn bản lớn được hiển thị trong dịch vụ xác thực đánh dấu.Nhấn nút Kiểm tra.