Skip to content

Instantly share code, notes, and snippets.

@mbostock
Created October 28, 2011 17:22
Show Gist options
  • Save mbostock/1322814 to your computer and use it in GitHub Desktop.
Save mbostock/1322814 to your computer and use it in GitHub Desktop.
Case-Sensitivity and SVG-in-HTML
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
svg {
position: absolute;
}
body {
white-space: pre;
font: 12px Courier;
}
</style>
</head>
<body><script type="text/javascript">
var ns = "http://www.w3.org/2000/svg",
svg = document.body.appendChild(document.createElementNS(ns, "svg")),
text = svg.appendChild(document.createElementNS(ns, "textPath"));
write(document, "querySelector", "textPath"); // fail
write(document, "querySelector", "textpath"); // fail
writeAll(document, "querySelectorAll", "textPath"); // fail
writeAll(document, "querySelectorAll", "textpath"); // fail
writeAll(document, "getElementsByTagName", "textPath"); // fail
writeAll(document, "getElementsByTagName", "textpath"); // fail
write(svg, "querySelector", "textPath"); // fail
write(svg, "querySelector", "textpath"); // fail
writeAll(svg, "querySelectorAll", "textPath"); // fail
writeAll(svg, "querySelectorAll", "textpath"); // fail
writeAll(svg, "getElementsByTagName", "textPath"); // fail
writeAll(svg, "getElementsByTagName", "textpath"); // fail
write(svg, "querySelector", "*"); // success!
function write(element, method, selector) {
var result = element[method](selector);
document.write(element + " " + method + "(" + selector + "): ");
if (result) document.write(result);
document.writeln("");
}
function writeAll(element, method, selector) {
var results = element[method](selector),
i = -1,
n = results.length;
document.write(element + " " + method + "(" + selector + "): ");
while (++i < n) {
document.write(results[i]);
if (i < n - 1) document.write(", ");
}
document.writeln("");
}
</script></body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment