16

探索 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>

所以我有两个问题：
第一：       谷歌如何能够使用script标签之间的文本？
第二：  语法<g:plusone ...HTML 是否有效？这叫什么？

4

3 回答 3

12

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+plusone 制作了自己的文档类型，那它可能是有效的，但它不满足 HTML 的有效性，而且它甚至不是 XHTML 文档中的命名空间格式良好，除非您添加额外xmlns:g的它也。

于 2011-07-15T21:30:53.707 回答
2

语法<g:plusone... HTML 有效吗？

不

这叫什么？

无效的伪命名空间

于 2011-07-15T21:20:08.173 回答
2

第一个技巧很有趣。它看起来像是一种将“全局”参数从页面标记传递到外部脚本的创造性方式。有多种方法可以找到<script>源代码当前运行的元素，如果该<script>元素的内部文本可以从 DOM 访问，即使浏览器忽略它，我也不会感到惊讶。

<script>在您的问题中，此模式允许每个外部客户端脚本（至少）使用自己的本地化设置，并且还允许服务器端代码将该参数呈现为呈现元素本身的副作用。这很让人佩服。

第二个技巧，我不太确定。基本上，我认为大多数浏览器会将命名空间<g:plusone>元素视为未知甚至无效，因此它们应该呈现其内容，但它当然不会做任何事情，因为该元素一开始就是空的。

但是，客户端代码可能仍然能够使用 DOM 导航匹配命名空间元素，并将其替换为自己生成的内容。

于 2011-07-15T21:33:23.953 回答