Javascript Google +1 按钮不符合 W3C
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6217434/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google +1 Button not W3C compliant
提问by ingh.am
So I've been playing with Google's +1 button trying to get it on my website, but it's not W3C compliant.
所以我一直在玩谷歌的 +1 按钮，试图在我的网站上获取它，但它不符合 W3C 标准。
Here's the code:
这是代码：
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'en-GB'}
</script>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="medium" href="http://www.example.org"></g:plusone>
Does anyone know why this happens and how to make this compliant? Thanks
有谁知道为什么会发生这种情况以及如何使其符合要求？谢谢
EDIT: To get this to pass through the validation, I wrote an article on my website.
编辑：为了让这个通过验证，我在我的网站上写了一篇文章。
采纳答案by Quentin
Does anyone know why this happens?
有谁知道为什么会这样？
Because Google designed it to use tag soup instead of HTML
因为谷歌设计它使用标签汤而不是 HTML
How to make this compliant?
如何使这个合规？
The documentationhas alternative markup that is valid under the draft HTML 5 specification:
该文档具有在 HTML 5 规范草案下有效的替代标记：
<div class="g-plusone" data-size="standard" data-count="true"></div>
If you want it to work with HTML 4.x or XHTML 1.x then you might be out of luck (although you might be able to add the non-compliant markup using JS, but that would just be a hack to conceal it from validation and not at all in the spirit of valid markup)
如果您希望它与 HTML 4.x 或 XHTML 1.x 一起使用，那么您可能不走运（尽管您可以使用 JS 添加不合规的标记，但这只是将其隐藏起来的一种技巧）验证，完全不符合有效标记的精神）
回答by Gilbou
Insert this code in the header:
在标题中插入此代码：
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang:'en', parsetags:'explicit'}
</script>
Then insert this code where you want the button:
然后在您想要按钮的位置插入此代码：
<div id="plusone-div" class="plusone"></div>
<script type="text/javascript">
gapi.plusone.render('plusone-div',{"size": "small", "count": "true"});
</script>
The complete answer can be found here(in French)
完整的答案可以在这里找到（法语）
回答by dossy
I'm guessing you're trying to validate XHTML. The closest you're going to come is to successfully validating is by defining the "g" namespace on your element by adding this:
我猜您正在尝试验证 XHTML。您将要成功验证的最接近的是通过添加以下内容来定义元素上的“g”命名空间：
xmlns:g="http://base.google.com/ns/1.0"
i.e.,
IE，
<html xmlns:g="http://base.google.com/ns/1.0"> ... </html>
回答by Ricardo de la Vega
The simplest way to make Google Plus One code to validate: Just put:
使 Google Plus One 代码验证的最简单方法：只需输入：
<div class="g-plusone"></div>
Instead of:
代替：
<g:plusone size="medium" href="http://www.example.org"></g:plusone>
Drawbacks: you cannot add parameters such as 'count' or 'size', or the code will not be valid any more.
缺点：不能添加诸如“count”或“size”之类的参数，否则代码将不再有效。
It's Google's proposed code for HTML5, but will work for other (X)HTML flavours. In HTML5 you CAN add parameters such as 'data-count', data-size', etc.
这是 Google 为 HTML5 提议的代码，但也适用于其他 (X)HTML 风格。在 HTML5 中，您可以添加参数，例如“数据计数”、“数据大小”等。
回答by Xavier
Try this:
尝试这个：
<div class="g-plusone" data-size="standard" data-count="true"></div>
回答by SuN
Keep the code before you close the body tag, and replace:
在关闭 body 标签之前保留代码，并替换：
<g:plusone size="medium"></g:plusone>
by :
经过 ：
<div class="g-plusone" id="gplusone"></div>
<script type="text/javascript">
var ValidMe=document.getElementById("gplusone");
ValidMe.setAttribute("data-size","medium");
ValidMe.setAttribute("data-count","true");
</script>
As usual, it does the trick...
像往常一样，它可以解决问题......
回答by seo outsourcing
http://james-ingham.co.uk/posts?p=google-plusone-w3c-valid
http://james-ingham.co.uk/posts?p=google-plusone-w3c-valid
<!-- Put inside the <head> tag. -->
<script type="text/javascript"
src="http://apis.google.com/js/plusone.js">
{lang: 'en-GB'}
</script>
<!-- Put where you wish to display button. -->
<script type="text/javascript">
document.write('<g:plusone size="medium" href="http://www.example.org/post"></g:plusone>');
</script>
回答by Magi
its just simple
它很简单
Use the following inside a div tag which you can configure to place it wherever you want in your page and it is valid.
在 div 标签中使用以下内容，您可以将其配置为将其放置在页面中的任何位置，并且它是有效的。
<div class="g-plusone"></div>
I am using it in Our Web site www.armaven.com. Check it out. If you want.
我在我们的网站www.armaven.com 中使用它。一探究竟。如果你想。
回答by Shoaib Nawaz
The other way can be to Customize DTD as I did. I downloaded the xhtml1-strict.dtd
另一种方法是像我一样自定义 DTD。我下载了 xhtml1-strict.dtd
Find the following entity definition in the dtd file
在 dtd 文件中找到以下实体定义
<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; )*">
And edit it to be as follow (This will help to resolve the contextual validation i.e. where should this tag appear)
并将其编辑如下（这将有助于解决上下文验证，即该标签应该出现在哪里）
<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; | g:plusone)*">
Now defining new element
现在定义新元素
<!ELEMENT g:plusone EMPTY>
And then listing attributes
然后列出属性
<!ATTLIST g:plusone
href %URI; #IMPLIED
size CDATA #IMPLIED
>
回答by Brandon
This is the solution I came up with...
这是我想出的解决方案...
<span id="plusone"></span>
<script type="text/javascript">
//< ![CDATA[
$("#plusone").html('<g:plusone></g:plusone>');
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
//]]>
</script>
Make sure you have <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>or other link to jquery script in your header!
确保您<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>的标题中有或其他指向 jquery 脚本的链接！
