Hướng dẫn parse html to string javascript - phân tích cú pháp html thành chuỗi javascript

Nếu bạn đã theo dõi kênh YouTube của tôi thì bạn sẽ biết tôi thích khám phá những điều mới trong JavaScript.love discovering new things in JavaScript.

Điều này là không khác nhau. Hãy vào đó 😎

Video hướng dẫn

Nếu bạn thích xem một video hướng dẫn trên trình phân tích cú pháp DOM, vui lòng xem nó bên dưới 👇

DOM Suy việc phân tích cú pháp

Nó có tên. Đối tượng

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));

Điều này thực sự rất tuyệt.

Hãy xem nó trong hành động:

const html = `
  
    
        
Page Title
    
  
`;

const parser = new DOMParser();
const parsedDocument = parser.parseFromString(html, "text/html");

console.log(parsedDocument);

Nhập chế độ FullScreenen EXIT Mode FullScreen

Nếu bạn đã kiểm tra bảng điều khiển sau khi chạy mã này, bạn sẽ thấy một đối tượng tài liệu chính thức, giống như

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));

Điều này có nghĩa là bạn có thể làm những việc khác như:

// Select the 
 page title
const pageTitle = parsedDocument.getElementById("title");

// Update the title's text
pageTitle.textContent = "A new page title.";

Nhập chế độ FullScreenen EXIT Mode FullScreen

Nếu bạn đã kiểm tra bảng điều khiển sau khi chạy mã này, bạn sẽ thấy một đối tượng tài liệu chính thức, giống như

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));

• Điều này có nghĩa là bạn có thể làm những việc khác như:
• Cách tôi nhìn thấy, có hai trường hợp sử dụng chính cho tính năng này:

Tạo các thành phần DOM từ chuỗi HTML (mặc dù chúng tôi có các kỹ thuật khác trong những ngày này như

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));

Lấy một tài liệu XML đầy dữ liệu và phân tích cú pháp nó 😊

Dù bằng cách nào, tôi hy vọng bạn tìm thấy

var t0, t1, html;

t0 = performance.now();
html = document.implementation.createHTMLDocument("test");
t1 = performance.now();

console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")

html.documentElement.innerHTML = '
test1
';

console.log(html.getElementById("test1"));