Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Really small native javascript function to convert text with straight quotes to curly/smart quotes.
function curlies(element) {
function smarten(text) {
return text
/* opening singles */
.replace(/(^|[-\u2014\s(\["])'/g, "$1\u2018")
/* closing singles & apostrophes */
.replace(/'/g, "\u2019")
/* opening doubles */
.replace(/(^|[-\u2014/\[(\u2018\s])"/g, "$1\u201c")
/* closing doubles */
.replace(/"/g, "\u201d")
/* em-dashes */
.replace(/--/g, "\u2014");
};
var children = element.children;
if (children.length) {
for(var i = 0, l = children.length; i < l; i++) {
curlies(children[i]);
}
} else {
element.innerHTML = smarten(element.innerHTML);
}
};
<!DOCTYPE html>
<head>
<title>curlier - native</title>
</head>
<body>
<section class="what">
<div class="awesome">
<div class="classnames">
<article class="i-have">
<h1>It's a good day.</h1>
<h2>What's up my friend?</h2>
<p>He said, "She's my best friend."</p>
<a href="#">Go "Here", I say.</a>
</article>
</div>
</div>
</section>
<script src="curlies.js"></script>
<script>
curlies( document.body );
</script>
</body>
</html>

I noticed a small problem when using [br] tags, specifically inside a [p] tag, that will stop the function from updating the content. Any idea how to modify it? I'm not sure how.

By the way, thanks for writing this. Looks nice and saves time.

Same problem here with the [br] element

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment