Dynamic code evaluation is a very controversial subject in every programming language that allows it, but especially in javascript since it can be a major security risk, especially when evaluating code from untrusted source. Nevertheless it is useful technique, that can be helpful in development scenarios or in certain edge cases as an optimization tool e.g. for dynamic loop unwinding.
Let's look look at the ways we can evaluate string as a javascript code.
I have been working as a web coder for a long time and what always bothered me is how inefficient a process of creating a frontend for website is. And there are two major reasons for that — code reusability / toolchain problems and flaws in typical web design workflow. I will leave code issues for some other time so we can focus on design for now.
This is a familiar view for most of web users:
And there are a lot jQuery plugins and plain JavaScript code that can help you create rating widget in your form. And the reason because it's all written in JavaScript is that when a need for such a rating system first arose CSS really lacked the ability to do stuff like this.
Here's what we are going to be doing in this tutorial:
There are a lot of ways to do message bubbles, so here are some key points to my technique:
jQuery plugins provide great functionality and are pretty easy to use — just add to the page a line like this $('.some-class').somePlugin() and you are good to go. While this works very well for small websites, it turns into real mess when you have a large complex website with dozens of plugins used across hundreds of views (as in MVC pattern).
Basically you either have to sacrifice page loading speed (inline scripts pause document parsing) and html code beauty by inserting plugin initialization inline after the necessary DOM element or loose logical connection between a DOM element and the plugin by moving all initialization code to a separate js file.