Có hàm getElementsByTagName() như hàm cho biến chuỗi javascript không?

Question

Tôi có thể sử dụng hàm getElementsByTagName() để lấy một tập hợp các phần tử từ một phần tử trong một trang web.

Tôi muốn có thể sử dụng chức năng tương tự trên nội dung của biến chuỗi javascript thay vì nội dung của phần tử DOM.

Làm cách nào để thực hiện việc này?

EDIT

tôi có thể làm điều này bằng cách tạo ra một yếu tố một cách nhanh chóng.

var myElement = new Element('div'); 
myElement.innerHTML = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>"; 
var emCollection = myElement.getElementsByTagName('em'); 
alert(emCollection.length); // This gives 1 

Tuy nhiên, việc tạo phần tử nhanh chóng để thuận tiện cho việc sử dụng hàm getElementsByTagName() dường như không đúng và không hoạt động với các thành phần trong Internet Explorer.

Answer 1

HTML trong chuỗi không có gì đặc biệt. Nó chỉ là văn bản trong một chuỗi. Nó cần phải được phân tích cú pháp thành một cây để nó có ích. Đây là lý do tại sao bạn cần phải tạo một phần tử, sau đó gọi getElementsByTagName trên đó, như bạn thấy trong ví dụ của mình.

Answer 2

function countTags(html, tagName) { 
    var matches = html.match(new RegExp("<" + tagName + "[\\s>]", "ig")); 
    return matches ? matches.length : 0; 
} 

alert(
    countTags(
     "<strong>hello</strong><em>there</em><strong>hot stuff</strong>", 
     "em" 
    ) 
); // 1 

Answer 3

Tiêm chuỗi thành DOM, như bạn đã chỉ ra, là cách dễ nhất, đáng tin cậy nhất để thực hiện việc này. Nếu bạn hoạt động trên một chuỗi, bạn sẽ phải tính đến tất cả các tình huống thoát có thể làm cho một cái gì đó mà trông giống như một thẻ không thực sự là là một thẻ.

Ví dụ, bạn có thể có

<button value="<em>"/> 
<button value="</em>"/> 

trong đánh dấu của bạn - nếu bạn đối xử với nó như một chuỗi, bạn có thể nghĩ rằng bạn có một thẻ <em> trong đó, nhưng trong thực tế, bạn chỉ có hai thẻ nút .

Bằng cách tiêm vào DOM qua innerHTML, bạn đang tận dụng trình phân tích cú pháp HTML được tích hợp sẵn của trình duyệt, điều này khá nhanh. Làm như vậy thông qua biểu thức chính quy sẽ là một nỗi đau và các trình duyệt thường không cung cấp chức năng DOM như để tìm các phần tử trong chuỗi.

Một điều khác bạn có thể thử sẽ phân tích cú pháp chuỗi là XML, nhưng tôi nghi ngờ điều này sẽ phiền phức và chậm hơn so với phương pháp chèn DOM.

Answer 4

var domParser = new DOMParser(); 
var htmlString = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>"; 
var docElement = domParser.parseFromString(htmlString, "text/html").documentElement; 
var emCollection = docElement.getElementsByTagName("em"); 
for (var i = 0; i < emCollection.length; i++) { 
    console.log(emCollection[i]); 
}