Обработка метаданных с помощью Javascript - PullRequest
0 голосов
/ 24 мая 2011

Я пытаюсь прочитать метаданные со страницы 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"

Как я могу получить доступ к содержимому, но не к полю свойства, и как я могу получить свойство?

Ответы [ 3 ]

4 голосов
/ 24 мая 2011

Чтобы ответить на вопрос:

«Как я могу получить доступ к содержимому, но не к полю свойства»

содержимое являетсястандартный атрибут метаэлемента HTML , поэтому браузеры будут создавать эквивалентное свойство DOM для связанного метаэлемента DOM.

свойство не является стандартным атрибутом для метаэлемент HTML , поэтому некоторые браузеры не будут создавать подобное свойство (например, Firefox), в то время как другие браузеры (например, IE) будут.Поэтому getAttribute следует использовать для любого нестандартного значения атрибута, но прямой доступ к свойству DOM следует использовать для значений стандартных атрибутов.

Как общее правилоВы не должны использовать нестандартные атрибуты для элементов HTML, тогда вы всегда можете получить доступ к значениям, используя свойства DOM (что является наиболее подходящим методом для элементов HTML DOM).

Обратите внимание, что метаэлем HTML5 - это то же самое, что и элемент HTML 4.01, связанный с вышеупомянутым, однако, в настоящее время спецификация HTML 4, вероятно, лучше использовать в обычной сети.HTML5-специфичный код действительно должен использоваться только при настройке функций HTML5 конкретного браузера.

3 голосов
/ 20 октября 2011

Вот полный рабочий пример ..

<!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>
2 голосов
/ 24 мая 2011

Вы хотите функцию getAttribute:

>meta[6].getAttribute('property');
   "og:image"
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...