Created
August 12, 2013 23:49
-
-
Save karbassi/6216484 to your computer and use it in GitHub Desktop.
Really small native javascript function to convert text with straight quotes to curly/smart quotes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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); | |
} | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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> |
Same problem here with the [br] element
This just solved a huge problem for me. Thank you.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.