Hướng dẫn jquery split html into array - jquery chia html thành mảng

0

Mới! Lưu câu hỏi hoặc câu trả lời và sắp xếp nội dung yêu thích của bạn. Tìm hiểu thêm.
Learn more.

Nói tôi có

var string = 
"

Header

this is a small paragraph

  • list element 1.
  • list element 2.
  • list element 3. With a small update.
" //newlines for clarity only

Làm cách nào để phân chia chuỗi này, sử dụng JavaScript để tôi nhận được

var array = string.split(/*...something here*/)

array = [
"

Header

", "

this is a small paragraph

", "
  • list element 1.
  • list element 2.
  • list element 3. With a small update.
" ]

Tôi chỉ muốn chia các yếu tố HTML hàng đầu, không phải trẻ em.

Hướng dẫn jquery split html into array - jquery chia html thành mảng

Hỏi ngày 18 tháng 4 năm 2013 lúc 19:48Apr 18, 2013 at 19:48

Hướng dẫn jquery split html into array - jquery chia html thành mảng

Bạn có thể làm điều gì đó như thế này:

var string = '

'; var elements = $(string).map(function() { return $('
').append(this).html(); // Basically `.outerHTML()` });

Và kết quả:

["

Header

", "

this is a small paragraph

", "
  • list element 1.
  • list element 2.
  • list element 3. With a small update.
"]

Đã trả lời ngày 18 tháng 4 năm 2013 lúc 19:52Apr 18, 2013 at 19:52

BlenderBlenderBlender

281K52 Huy hiệu vàng428 Huy hiệu bạc487 Huy hiệu đồng52 gold badges428 silver badges487 bronze badges

5

Một giải pháp biểu diễn (http://jsperf.com/spliting-html):

var splitter = document.createElement('div'),
  text = splitter.innerHTML = "

Header

\

this is a small paragraph

\
    \
  • list element 1.
  • \
  • list element 2.
  • \
  • list element 3. With a small update.
  • \
", parts = splitter.children, part = parts[0].innerHTML;

Đã trả lời ngày 9 tháng 4 năm 2015 lúc 19:08Apr 9, 2015 at 19:08

Robert Plummerrobert PlummerRobert Plummer

5881 Huy hiệu vàng3 Huy hiệu bạc12 Huy hiệu đồng1 gold badge3 silver badges12 bronze badges

Bạn không thể làm điều này với các biểu thức thông thường. Biểu thức thông thường của bạn sẽ thất bại nếu bạn có một số yếu tố lồng nhau cùng loại, ví dụ:

Điều này là do thực tế là các biểu thức thông thường chỉ có thể xử lý các ngôn ngữ thông thường và HTML là ngôn ngữ không có ngữ cảnh thực sự (và không có ngữ cảnh "phức tạp" hơn thông thường).

Xem thêm: https://stackoverflow.com/a/1732454/2170192

Nhưng nếu bạn không có các phần tử lồng nhau cùng loại, bạn có thể chia chuỗi HTML của mình bằng cách thực hiện tất cả các trận đấu được trả về bởi biểu thức chính quy sau (sử dụng liên kết ngược):

/<(\w+).*<\/\1\s*>/igsm
  • <(\w+) phù hợp với ký hiệu ít hơn và một số nhân vật từ (chữ cái, chữ số, dấu gạch dưới), trong khi nắm bắt các nhân vật từ thông qua dấu ngoặc đơn (nhóm chụp đầu tiên).
  • .* khớp nội dung của phần tử.
  • <\/ khớp với việc mở thẻ cuối.
  • var array = string.split(/*...something here*/)
    
    array = [
    "

    Header

    ", "

    this is a small paragraph

    ", "
    • list element 1.
    • list element 2.
    • list element 3. With a small update.
    " ]
    0 là bản sao lưu phù hợp với chính xác chuỗi các ký hiệu được ghi lại thông qua nhóm chụp đầu tiên.
  • var array = string.split(/*...something here*/)
    
    array = [
    "

    Header

    ", "

    this is a small paragraph

    ", "
    • list element 1.
    • list element 2.
    • list element 3. With a small update.
    " ]
    1 khớp với khoảng trắng tùy chọn và dấu hiệu lớn hơn.
  • var array = string.split(/*...something here*/)
    
    array = [
    "

    Header

    ", "

    this is a small paragraph

    ", "
    • list element 1.
    • list element 2.
    • list element 3. With a small update.
    " ]
    2 là các công cụ sửa đổi: không phân biệt chữ hoa chữ thường, toàn cầu, DOT-mates-all-symbols và nhiều dòng.

Đã trả lời ngày 18 tháng 4 năm 2013 lúc 19:56Apr 18, 2013 at 19:56

Alex Shesterovalex ShesterovAlex Shesterov

24.7K12 Huy hiệu vàng77 Huy hiệu bạc98 Huy hiệu đồng12 gold badges77 silver badges98 bronze badges