jQuery Tutorial Introduction

jQuery is a quick、small、easy to use javascript library, many web developers use it to simplify their works.

Here is a simple jQuery example:
ExampleShow/Hide element
Source Code Expand
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<!-- Javascript -->
<script type="text/javascript">
$(document).ready(function (){
    $("#btn1").click(function(){
        if($("#example1").is(":visible")){
            $("#example1").hide();
        }else{
            $("#example1").show();
        }

        $("#example1").is(":visible") ? $("#btn1").html("Hide") : $("#btn1").html("Show");
    });
});
</script>

<!-- HTML -->
<span id="example1">This sentence will be invisible when you click </span>
<button type="button" id="btn1">Hide</button> this is the second sentence.


comments powered by Disqus