窗口、easyui-window、easyui-panel、easyui-linkbutton

最新推荐文章于 2019-10-30 15:18:17 发布

weixin_30791095

最新推荐文章于 2019-10-30 15:18:17 发布

阅读量134

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/nicebaby/p/6122045.html

本文介绍如何使用jQuery中的各种选择器（ID选择器、标签选择器、类选择器等）来实现DOM元素的选择和事件绑定，并展示了如何在jQuery对象与DOM对象之间进行转换。

//窗口


<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript">

//调用jquery
//相当于window.load()当窗口加载完毕之后触发
$(function(){
    
    //alert("hello jquery");
    //选择器
    //id选择器
    $("#bt1").click(
            
            function (){
            alert("点击了按钮  文字=" );
            }
    
    );
    
    //标签选择器
    
    //属性过滤器
    
    $("input[type=button]").click(
    
    function (){
        alert("通过标签选择器选中了按钮")
        }
    
    );
    
    //类选择器
    $(".cl_2").click(
            
            function (){
                alert("通过类选择器选中了按钮")
                }

    );
    //使用dom方式获取元素
    var bt_3 =document.getElementById("bt3");
    
    
    
    $(bt_3).click(
            function()
            {
                alert("从DOM对象转为jQuery对象");
            }
    );
    
    //从Jquery对象转为DOM对象
    var $jbt_1=$("#bt1");
    
    alert("集合长度 ="+$jbt_1.length);
    
    var bt_1=$jbt_1.get(0);
    
    alert("DOM按钮的内容="+bt_1.value);
    
    var $jbt_4=$("button");
    
    var bt_4= $jbt_4[0];
    
    alert("DOM按钮的内容="+bt_4.firstChild.nodeValue);
    
    $jbt_4.click(
            function (){
                alert("button 的文本="+$(this).text())
                }
    
    
    );
})


</script>

</head>
<body>
测试
<br>
<input type="button"  id="bt1" value="按钮1">
<br><br>
<input type="button" class="cl_2" id="bt2" value="按钮2">

<br><br>
<input type="text" class="cl_2">

<br><br>
<input id="bt3" value="按钮3" type="button">
<br><br>

<button id="bt4">按钮4</button>
<br><br>

<button id="bt5">按钮5</button>

</body>