Кнопка Google +1: как они это делают? - PullRequest
Новая
       2

Кнопка Google +1: как они это делают?

16 голосов
/ 16 июля 2011

Исследуя кнопку Google +1, я обнаружил две странности в коде, который они предоставляют: 

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {lang: 'en-GB'}
</script>

<g:plusone size="tall" href="http://www.google.com"></g:plusone>

Итак, у меня два вопроса: Первое: Как Google может использовать текст между тегами script? Второй: Синтаксис <g:plusone ... HTML действителен?Как это называется?

Ответы [ 3 ]

12 голосов
/ 16 июля 2011

Как Google может использовать текст между тегами скрипта?

<script> элементы отлично видны в DOM: 

<script type="text/javascript">//FIRST SCRIPT BLOCK</script>

<script type="text/javascript">
    var s= document.getElementsByTagName('script')[0];
    alert(s.textContent); // "//FIRST SCRIPT BLOCK"
</script>

хитрый Googleхитрость заключается в том, чтобы поместить содержимое в <script>, который имеет внешний src.В этом случае src переопределяет содержимое внутри блока и выполняет вместо этого внешний скрипт, но содержимое элемента <script> все еще доступно для чтения через DOM, даже если оно ничего не делает.

Является ли синтаксис <g:plusone ... HTML верным?Как это называется?

Нет.Если бы они создали свой собственный тип документа для HTML + плюс один, это могло бы быть допустимым , что , но это не удовлетворяет действительности для HTML, и это даже не является правильно сформированным пространством имен в документе XHTML, если только выдобавьте дополнительно xmlns:g для него тоже.

2 голосов
/ 16 июля 2011

Первый трюк интересный.Это похоже на творческий способ передачи «глобальных» аргументов из разметки страницы во внешние сценарии.Есть способ найти элемент <script>, который является источником кода, который в данный момент выполняется, и я не удивлюсь, если внутренний текст этого элемента <script> будет доступен из DOM, даже если браузер игнорируетit.

В вашем вопросе этот шаблон позволяет каждому внешнему клиентскому сценарию использовать (как минимум) свои собственные параметры локализации, а также позволяет программному коду на стороне сервера отображать этот параметр как побочный эффект рендеринга<script> сам элемент.Это впечатляет.

Второй трюк, я не уверен в этом.По сути, я думаю, что большинство браузеров считают элемент namespaced <g:plusone> как unknown или даже недопустимый , поэтому они должны визуализировать его содержимое, но это не такконечно, сделайте что-нибудь, поскольку этот элемент пуст для начала.

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

2 голосов
/ 16 июля 2011

Действителен ли синтаксис <g:plusone ... HTML?

Нет

Как это называется?

Неверные псевдо-пространства имен

...