處理元數據使用Javascript

我試圖使用JavaScript的HTML頁面讀取的元數據。我創建了所有元標記的數組，我試圖讀取屬性字段，但我似乎無法讓它工作。這裏是控制檯：處理元數據使用Javascript

>meta[6] 
    <meta property="og:image" content="http://www. example.com/img/1.png"> 
>meta[6].property 
    undefined 
>meta[6].content 
    "http://www. example.com/img/1.png"

我怎麼能夠訪問內容，但不是屬性字段，我怎麼能得到的財產？

來源

2011-05-24 Franz Payer

也許更多的上下文可以提供幫助。這是一個XML文檔嗎？你如何獲得陣列？ – sdleihssirhc 2011-05-24 03:31:33

展開你的代碼，你是如何得到元標記的，你是否試圖用getElementByTagName（）來獲取它？你知道只有默認的屬性可以很容易地工作 – Ibu 2011-05-24 03:33:29

你想要的getAttribute功能：

>meta[6].getAttribute('property'); 
    "og:image"

來源

2011-05-24 03:33:05 pthurlow

達到預期的結果，但不回答問題。 – RobG 2011-05-24 05:15:19

RobG的回答給了你正確的解釋。由元素中的元素定義的屬性被複制到DOM元素的屬性上。所以你可以通過'meta.content'訪問那些人。在你的情況下，「財產」不是一個標準。這就是爲什麼現在jQuery同時具有$ .attr（）和$ .prop。請參閱http://stackoverflow.com/questions/5874652/prop-vs-attr – 2011-10-19 23:58:59

要回答這個問題：

「我怎麼能夠訪問內容而不是屬性字段」

內容是HTML meta element的標準屬性，所以兄弟wsers將爲相關的DOM元素創建一個等效的DOM屬性。

屬性不是用於HTML meta element標準屬性，因此一些瀏覽器將不會創建相似特性（例如火狐），而其他的瀏覽器（例如，IE）將。因此getAttribute應該用於任何非標準屬性值，而是直接DOM屬性訪問應使用標準屬性的值。

作爲一般規則，則不應使用HTML元素非標準屬性，然後可以隨時訪問使用DOM屬性的值（這是HTML DOM元素最合適的方法）。

請注意，HTML5 meta element與上面鏈接的HTML 4.01元素相同，但HTML 4規範可能暫時適用於一般網頁。在針對特定瀏覽器的HTML5功能時，只能使用特定於HTML5的代碼。

來源

2011-05-24 05:12:51 RobG

這是一個完整的工作示例..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 
<head> 
<title>Cross-Window HTML</title> 
<meta property="og:title" content="Share Title" /> 
<meta property="og:description" content="Share Page Description" /> 
<meta property="og:image" content="Path to Share Image" /> 
<link rel="canonical" href="http://127.0.0.1/newWindowWrite.html" /> 
<script type="text/javascript"> 

function GetMetaValue(meta_name) { 

    var my_arr = document.getElementsByTagName("meta"); 
    for (var counter = 0; counter < my_arr.length; counter++) { 
     console.log(my_arr[counter].getAttribute('property')); 

     if (my_arr[counter].getAttribute('property') == meta_name) { 
      return my_arr[counter].content; 
     } 
    } 
    return "N/A"; 

} 


function newHTML() { 
    HTMLstring = '<html>\n'; 
    HTMLstring += '<head>\n'; 
    HTMLstring += '<title>Google +1</title>\n'; 
    HTMLstring += '<meta property="og:title" content="' + GetMetaValue('og:title') + '"/>\n'; 
    HTMLstring += '<meta property="og:description" content="' + GetMetaValue('og:description') + '"/>\n'; 
    HTMLstring += '<meta property="og:image" content="' + GetMetaValue('og:image') + '"/>\n'; 
    HTMLstring += '<link rel="canonical" href="' + location.href + '"/>\n'; 
    HTMLstring += '</head>\n'; 
    HTMLstring += '<body>\n'; 
    HTMLstring += '<div id="shareContent">\n'; 
    HTMLstring += '</div>\n'; 
    HTMLstring += '</body>\n'; 
    HTMLstring += '</html>'; 
    console.log(HTMLstring); 
    newwindow = window.open(); 
    newdocument = newwindow.document; 
    newdocument.write(HTMLstring); 
    newdocument.close(); 
} 
</script> 
</head> 
<body> 
<div onclick="newHTML();">Spawn Sharing Window</div> 
</body> 
</html>

來源

2011-10-19 23:51:17 jdrefahl

它修復了問題，但時間太長，並未解釋根本原因。特別是考慮到已經提到你的代碼是做 – 2011-10-20 00:00:23

嘿不用擔心我只是認爲這將有助於顯示的代碼完全工作的一塊，有人可以一起工作，看看它是如何通過控制檯工作已有答案。無論如何，我需要取消Google +1集成，因爲它不起作用。現在這是非常直接的..抱歉混淆。 – jdrefahl 2011-10-20 00:59:28

處理元數據使用Javascript

回答

相關問題