Avoid placing inline JavaScript within elements, especially javascript: pseudo-URLs which (besides being considered harmful and should be avoided) are essentially JavaScript-inside-URL-inside-HTML. The recommended approach would be to take the headline and:
- Encode it as a JavaScript string literal. (By replacing
\, ', control characters, and possibly Unicode characters, or using a JSON encoder for assistance.)
- Then, encode it as a URL.
- Finally, encode it as HTML.
It is preferable to include the data in the markup, where you only need to focus on basic HTML encoding like you do everywhere else to prevent cross-site scripting:
<a href="#" class="confirmdelete-${fn:escapeXml(result.id)}" title="${fn:escapeXml(result.headline)}">Delete</a>
and let the JavaScript extract them:
<script type="text/javascript">
for (var i= document.links.length; i-->0;) {
var link= document.links[i];
if (link.className.indexOf('confirmdelete-')===0) {
link.onclick= function() {
confirmDelete(this.title, this.className.substring(14));
return false;
};
}
}
</script>
(there may be more efficient, concise, or cleaner ways to write the code above using utility functions or frameworks, and there's room for discussion on whether a link is the most suitable markup for this type of action, but that's the fundamental concept.)