Recently to use Knockoutjs in the project, so today we first studied the KNOCKOUTJS environment, and carried out a simple test, the need for friends to understand the next
Recently to use Knockoutjs in the project, so today we first studied the KNOCKOUTJS environment, and carried out a simple test.
First to http://knockoutjs.com/index.html download the latest version of Knockoutjs, the author here to download is knockout-2.2.0.js. Then create a new. html file, add the following statement to the HTML document to import this JS:
<script type= "Text/javascript" src= "Knockout-2.2.0.js" ></script>
Here we can already write Knockoutjs code, we print "Hello world!" For example, write the following code:
Copy CodeThe code is as follows:
<script type= "Text/javascript" src= "Knockout-2.2.0.js" ></script>
<span data-bind= "Text:helloworld" ></span>
<script type= "Text/javascript" >
var Appviewmodel = {
HelloWorld: ' Hello world! '
};
Ko.applybindings (Appviewmodel);
</script>
Then use your browser to open this HTML file and see "Hello world!!" The words.
In the above code:
<span data-bind= "Text:helloworld" ></span>
Defines a span and uses Data-bind to bind HelloWorld to a span so that the content in span is the content in the HelloWorld variable.
Copy CodeThe code is as follows:
<script type= "Text/javascript" >
var Appviewmodel = {
HelloWorld: ' Hello world! '
};
Ko.applybindings (Appviewmodel);
</script>
A appviewmodel is defined in script and a variable is defined for it: HelloWorld, whose value is: Hello world!!, then activates Appviewmodel using the Ko.applybindings () method, This allows you to see this content in the Web page.
The above is just using Knockoutjs to do a very simple example, in the process of running this example, there is a small problem, I am not very clear why. The code previously written is:
Copy CodeThe code is as follows:
<script type= "Text/javascript" src= "Knockout-2.2.0.js" ></script>
<script type= "Text/javascript" >
var Appviewmodel = {
HelloWorld: ' Hello world! '
};
Ko.applybindings (Appviewmodel);
</script>
<span data-bind= "Text:helloworld" ></span>
I put <script> in the front of <span>, so that can not show any content, not very clear of the reasons, but also please advise.
Transferred from: http://www.jb51.net/article/32184.htm
KNOCKOUTJS's Environment Construction tutorial