php JS和JQ 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
<style type="text/css">
#one
{
    color:red;
    font-size:30px;
    background-color:#999;}
</style>
</head>

<body>

<div id="one"><span>one</span></div>
<div class="test" bs="aa">two</div>
<div class="test">three</div>
<div class="test">four</div>
<input type="text" name="uid" id="uid" />
<input type="button" id="btn" value="取消绑定" />
<input type="button" id="add" value="绑定事件" />

</body>
<script type="text/javascript">

$(document).ready(function(e) {
    
    //js方式
    //1.根据ID取元素，DOM对象
    //var div=document.getElementById("one");
    //2.根据class取元素  取出来的是数组
    //var div=document.getElementsByClassName("test");
    //3.根据name取元素   取出来的是数组
    //var bd=document.getElementsByName("uid");
    //4.根据标签名取元素  取出来的是数组
    //var div=document.getElementsByTagName("div");
    
    //操作内容
    //1.非表单元素
    //alert(div.innerText);   取值  直接输出
    //div.innerText="aaa";    赋值  直接输出
    //div.innerHTML;          取值或添加HTML代码  可以解析HTML代码
    //2.表单元素
    //div.value                  取值或赋值  
    
    //操作属性
    //div.setAttribute("","");  //设置属性
    //div.removeAttribute("");  //移除属性
    //div.getAttribute("");     //获取属性
    
    //操作样式
    //div.style.backgroundColor="red";    设置样式表  背景色 红色
    //alert(div.style.color)            获取样式表  只能获内联样式
    
    
    
    //在数组里面如果要取DOM对象使用索引的方式，如果要取JQUERY对象使用eq()
    
    //jquery方式
    //1.根据ID取元素，JQUERY对象
    //var div=$("#one");
    //2.根据class取元素   取出来的是数组
    //var div=$(".test");
    //3.根据属性取元素     取出来的是数组
    //var bd=$("[name='uid']");
    //4.根据标签名取元素   取出来的是数组
    //var div=$("div");
    //5.组合选取
    //var div=$("div span");
    
    //操作内容
    //1.非表单元素
    //alert(div.text());     取值  直接输出
    //div.text("aaa");         赋值  直接输出
    //div.html();             取值或添加HTML代码  可以解析HTML代码
    //2.表单元素
    //div.val("aaa");         取值或赋值  
    
    //操作属性
    //div.attr("test","aa");    //设置属性
    //div.removeAttr("test");   //移除属性
    //div.attr("test");         //获取属性
    
    //操作样式
    //div.css("background-color","#FF0");   设置样式表  背景色 黄色
    //alert(div.css("color"));                获取样式表  内联内嵌都可以
    
    //操作元素
    //var str="<div id='abc' style='width:100px; height:100px; background-color:red'></div>";  //添加元素
    //div.append(str);    //追加元素
    //$("#abc").remove(); //移除某个元素
    
    /*$(".test").click(function(){    //添加事件
        
        alert($(this).text());
        
        })*/
    
    /*$(".test").bind("click",function(){   //添加事件
        
        alert($(this).text());
        
        });    
        
    $("#btn").click(function(){                //解除事件
        
        $(".test").unbind("click");
        
        });
        
    $("#add").click(function(){                //绑定事件
        
        $(".test").bind("click",function(){
        
        alert($(this).text());
        
        });
        
        });*/
    
});


</script>
</html>
View Code

 

posted @ 2016-06-20 20:01  哔哩哔哩干杯  阅读(194)  评论(0)    收藏  举报