jQuery学习一 

<!DOCTYPE html>
<html>
<head>
    <title>jquery的启动</title>
</head>
<script type="text/javascript" src='./js/jquery-3.2.1.min.js'></script>
<script>
    // alert(1);


    /*
    页面中启动jquery：
    当页面中所有元素加载完成后，才会执行启动jquery的代码，也就是$(function() {}里面写代码时，页面中所有元素都已经出现了
    */
    $(function() {
        // alert('我启动了jquery');

        // 1.读取Dom对象
        var v_document = document.getElementById('name');
        alert(v_document.value);

        // 2.DOM对象转化为jquery对象
        var v_jquery = $(v_document);
        // alert(v_jquery.value); // 错误 jquery对象不能使用Dom中的属性value
        alert(v_jquery.val());

        //3.jquery转DOM对象
        var jquery = $('#name');
        alert(jquery.val());
        // jquery对象其实是一个数组，数组长度取决于jquery获取的页面元素个数，数组中存放的是DOM对象类型
        var v_doc = jquery[0];
        alert(v_doc.value);
        

    })
    // alert(2);

    // // 启动jquery的方法
    // $(function() {
    //     alert('jquery启动1');
    // })

    // jquery(function() {
    //     alert('jquery启动2');
    // })

    // window.jquery(function() {
    //     alert('jquery启动3');
    // })

</script>

<body>
   <input type="text" name="name" id="name" value="张三">
</body>
</html>

 

posted on 2017-11-26 19:54  玉思盈蝶  阅读(212)  评论(0)    收藏  举报

导航