Element name gcse:searchbox-only cannot be represented as XML 1.0

问题

I am getting the following error in w3 validator,

 Line 62, Column 140: Element name gcse:searchbox-only cannot be represented as XML 1.0.

I am using Google search bar inside website which is added by this code,

<gcse:searchbox-only></gcse:searchbox-only>

Please help out to avoid this error. Thanks

回答1:

Michael[tm] Smith, the guy who looks after the W3C HTML validator says here:

It's not an error, it's a warning. And it's emitted because the content is being served as HTML instead of with an XML MIME type, and HTML parsers don't know anything about namespaces -- to put it in XML terms, every element name is a local name -- and so in HTML, the literal name of that element is "g:plusone". And that name can't be represented in XML because XML doesn't allow colons in the local names. So the spirit of the warning is to say, In case you ever want to serve this content as XML instead of HTML, you have an element name in it that's not allowed in XML.

He's talking about the element g:plusone but it's the same issue.

But I disagree slightly. Colons are valid in element local names in XML 1.0. They're only disallowed in XML 1.0 + namespaces So the warning message could definitely be improved.

UPDATE: I previously offered a workaround based on document.write, but as Jan M points out in the comments, IE has it's own ideas about what to do with elements with a colon in their tag names, so it didn't work there. Instead, I recommend following Jan's answer.

回答2:

I found this answer hidden in the google docs:

https://developers.google.com/custom-search/docs/element#html5

HTML5-valid div tags

You can use HTML5-valid div tags as long as you observe these guidelines:

The class attribute must be set to gcse-XXX
Any attributes must be prefixed with data-.

For example:

<div class="gcse-searchbox" data-resultsUrl="http://www.example.com" data-newWindow="true" data-queryParameterName="search" >

回答3:

You could always use <div class="gcse-search"></div> instead of <gcse:search></gcse:search>, then the error will go away from the w3c validator.

回答4:

Solution is very simple, Don't use directly the google search tag in html page. Just place a simple javascript code to insert the google search tag in html by javascript's innerhtml option.

Here is the example:

<div id="gsearch"></div>

<script>
   var gcseDiv = document.getElementById('gsearch');
   gcseDiv.innerHTML = '<gcse:search></gcse:search>'
</script>

After this line you can write or paste your google search code which will be same as below

      <script>
      (function() {
                var cx = 'xxxxxxxxxxxxxxxxxxxxxxxxx:xxxxxxxxx';
                var gcse = document.createElement('script');
                gcse.type = 'text/javascript';
                gcse.async = true;
                gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
                    '//www.google.com/cse/cse.js?cx=' + cx;
                var s = document.getElementsByTagName('script')[0];
                s.parentNode.insertBefore(gcse, s);
              })();

      </script>

Suggestion: Just put the above div and both script in a single parent div and manage css for parent div only.

回答5:

Maybe this is too simple, but I worked around the problem by just putting this inside and at the end of the javascript:

document.write('<gcse:search><\/gcse:search>');

And removed

It works in IE, Chrome, Firefox and Safari and validates.

回答6:

Use the following code if you only want to display the searchbox (without the resultsbox) using a DIV:

<div class="gcse-searchbox-only"></div>

来源：https://stackoverflow.com/questions/12736598/element-name-gcsesearchbox-only-cannot-be-represented-as-xml-1-0

标签

html

xml

validation

w3c-validation