Are single quotes allowed in HTML?
HtmlHtml Problem Overview
I am a big time user of using double quotes in PHP so that I can interpolate variables rather than concatenating strings. As a result, when I am generating HTML I often use single quotes for setting tag fields. For example:
$html = "<input type='text' name='address' value='$address'>";
Now this is far more readable to me than either
$html = "<input type=\"text\" name=\"address\" value=\"$address\">";
or
$html = '<input type="text" name="address" values="' . $address . '">' ;
From brief searches I have heard people saying that single quotes for HTML fields is not recognized by EVERY browser. Thus I am wondering what browsers would have problems recognizing single quote HTML?
Html Solutions
Solution 1 - Html
This is similar to When did single quotes in HTML become so popular?. Single quotes around attributes in HTML are and always have been permitted by the specification. I don't think any browsers wouldn't understand them.
Solution 2 - Html
As noted by PhiLho, although there is a widely spread belief that single quotes are not allowed for attribute values, that belief is wrong.
The XML standard permits both single and double quotes around attribute values.
The XHTML standard doesn't say anything to change this, but a related section which states that attribute values must be quoted uses double quotes in the example, which has probably lead to this confusion. This example is merely pointing out that attribute values in XHTML must meet the minimum standard for attribute values in XML, which means they must be quoted (as opposed to plain HTML which doesn't care), but does not restrict you to either single or double quotes.
Of course, it's always possible that you'll encounter a parser which isn't standards-compliant, but when that happens all bets are off anyway. So it's best to just stick to what the specification says. That's why we have specifications, after all.
Solution 3 - Html
>I have heard people saying that single quotes for HTML fields is not recognized by EVERY browser
That person is wrong.
Solution 4 - Html
Don't believe everything you see on Internet...
Funnily, I just answered something similar to somebody declaring single quotes are not valid in XHTML...
Mmm, I look above while typing, and see that Adam N propagates the same belief. If he can back up his affirmation, I retract what I wrote... AFAIK, XML is agnostic and accepts both kinds of quote. I even tried and validated without problem an XHTML page with only single quotes.
Solution 5 - Html
Only problem is data going into TEXT INPUT fields. Consider
<input value='it's gonna break'/>
Same with:
<input value="i say - "this is gonna be trouble" "/>
You can't escape that, you have to use htmlspecialchars.
Solution 6 - Html
As I was looking to find information on this in a much more recent version of the specification and it took me quite some time to find it, here it is:
From > # HTML > ## Living Standard — Last Updated 17 September 2021 > [...] > ### 13.1.2.3 Attributes > #### Single-quoted attribute value syntax
> The attribute name, followed by zero or more ASCII whitespace, followed by a single U+003D EQUALS SIGN character, followed by zero or more ASCII whitespace, followed by a single U+0027 APOSTROPHE character ('), followed by the attribute value, which, in addition to the requirements given above for attribute values, must not contain any literal U+0027 APOSTROPHE characters ('), and finally followed by a second single U+0027 APOSTROPHE character (').
>In the following example, the type attribute is given with the single-quoted attribute value syntax:
>
> If an attribute using the single-quoted attribute syntax is to be followed by another attribute, then there must be ASCII whitespace separating the two.
Solution 7 - Html
I also tend to use single quotes in HTML and I have never experienced a problem.
Solution 8 - Html
I used single quotes in HTML pages and embedded JavaScripts into it and its works fine. Tested in IE9, Chrome and Firefox - seems working fine.
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>Bethanie Inc. data : geographically linked</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
<script src='https://maps.googleapis.com/maps/api/js?v=3.11&sensor=false' type='text/javascript'></script>
<script type='text/javascript'>
// check DOM Ready
$(document).ready(function() {
// execute
(function() {
/////////////// Addresses ///////////////////
var locations = new Array();
var i = 0;
locations[i++] = 'L,Riversea: Comp Site1 at Riversea,1 Wallace Lane Mosman Park WA 6012'
locations[i++] = 'L,Wearne: Comp Site2 at Wearne,1 Gibney St Cottesloe WA 6011'
locations[i++] = 'L,Beachside:Comp Site3 Beachside,629 Two Rocks Rd Yanchep WA 6035'
/////// Addresses/////////
var total_locations = i;
i = 0;
console.log('About to look up ' + total_locations + ' locations');
// map options
var options = {
zoom: 10,
center: new google.maps.LatLng(-31.982484, 115.789329),//Bethanie
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true
};
// init map
console.log('Initialise map...');
var map = new google.maps.Map(document.getElementById('map_canvas'), options);
// use the Google API to translate addresses to GPS coordinates
//(See Limits: https://developers.google.com/maps/documentation/geocoding/#Limits)
var geocoder = new google.maps.Geocoder();
if (geocoder) {
console.log('Got a new instance of Google Geocoder object');
// Call function 'createNextMarker' every second
var myVar = window.setInterval(function(){createNextMarker()}, 700);
function createNextMarker() {
if (i < locations.length)
{
var customer = locations[i];
var parts = customer.split(','); // split line into parts (fields)
var type= parts.splice(0,1); // type from location line (remove)
var name = parts.splice(0,1); // name from location line(remove)
var address =parts.join(','); // combine remaining parts
console.log('Looking up ' + name + ' at address ' + address);
geocoder.geocode({ 'address': address }, makeCallback(name, type));
i++; // next location in list
updateProgressBar(i / total_locations);
} else
{
console.log('Ready looking up ' + i + ' addresses');
window.clearInterval(myVar);
}
}
function makeCallback(name,type)
{
var geocodeCallBack = function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var longitude = results[0].geometry.location.lng();
var latitude = results[0].geometry.location.lat();
console.log('Received result: lat:' + latitude + ' long:' + longitude);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(latitude, longitude),
map: map,
title: name + ' : ' + '\r\n' + results[0].formatted_address});// this is display in tool tip/ icon color
if (type=='E') {marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')};
Solution 9 - Html
Recently i've experienced a problem with Google Search optimization. If has a single quotes, it doesn't seem to crawl linked pages.
Solution 10 - Html
... or just use heredocs. Then you don't need to worry about escaping anything but END.
Solution 11 - Html
Single Quotes are fine for HTML, but they don't make valid XHTML, which might be problematic if anybody was using a browser which supported only XHTML, but not HTML. I don't believe any such browsers exist, though there are probably some User-Agents out there that do require strict XHTML.