jQuery的2把利器

DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>01_初始jQuerytitle>
        <script type="text/javascript">
            window.onload = function(){
                btn1 = document.getElementById("btn1");
                btn1.onclick = function(){
                    var username = document.getElementById("username").value;
                    alert(username)
                    
                }
            }
        script>
        
        <script type="text/javascript" src="../../js/jquery-1.10.1.js">script>
        <script type="text/javascript">
            //1\使用jQuery核心函数($,jQuery)
            //绑定文档加载完成的监听,就是跟window.onload的效果一样辣$(function(){})
                
            $(function(){
                $("#btn2").click(function(){
                    var username = $("#username").val();//给btn2绑定监听
                    alert(username)
                })
                
            })
            /*
             * jquery核心对象
             * 执行$()返回的对象
             * jQuery对象都会在前面加一个$
             */
        script>
    head>
    <body>
        
        用户名:
        <input type="text" id="username" >
        <button id="btn1">确定(原生版)button>
        <button id="btn2">确定(jQuery版)button>
    body>
html>

 

你可能感兴趣的:(jQuery的2把利器)