• jQuery(20161108)


     jQuery的引入包必须要在其他引入包的最上方,否则会出错。因为如果在页面加载完成后还未执行jQuery包,那么jQuery的引入包就没用了

    如果浏览器报错:Uncaught Error: Bootstrap's JavaScript requires jQuery_...

    就要注意文件引入的先后顺序,应该先引入jquery再引入bootstrap

    //js或jquer y里面有数据存储的方式
    //名字叫JSON
    /* var json = {
    code:"n001",
    name:"张三",
    js:{c:"p001",n:"回族"}
    };

    //取值 用点或者是索引
    alert(json["code"]);
    alert(json.js.n);
    */

    //去空格
    /*var str = " hello ";
    str = str.trim(); //重要 非空验证的时候可以用来去空格,还可以在ajax返回值的时候去空格
    alert(str.length);
    */

    <!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" />
    <!--引入JQUERY包(要先引入jequery,再写js,否则有些功能无法实现,因为如果js在上面,加载完上面的js后并没有加载上jequery,有些功能就无法实现,,,,所以jequery要在所有的引入前面)    min:压缩版-->
    <script src="jquery-3.1.1.min.js"></script>
    
    <style type="text/css">
    #a1{
        color:red;
        }
    .aa{ 100px; height:100px; background-color:#39F}
    </style>
    
    <title>无标题文档</title>
    </head>
    
    <body>
    
    <div id="a1" class="tt" style="100px; height:200px;">11</div>
    
    <div class="aa" bs="1">aaaa</div>
    <div class="aa" bs="2">bbbbb</div>
    <div class="aa" bs="3">ccccc</div>
    
    <div name="cc"></div>
    <div bs="1"></div>
    <input type="text" id="p1" />
    <input type="button" id="b1" value="挂事件" />
    <input type="button" id="b2" value="移除事件" />
    <script type="text/javascript">
    
        //JS
        //根据ID取元素,取到的是具体的元素
        //var a = document.getElementById("a1");
        //根据CLASS取 (取到的是数组)
        //var a = document.getElementsByClassName("aa");
        //根据标签名取
        //var a = document.getElementsByTagName("div");
        //根据name取
        //var a = document.getElementsByName("cc");    
        //alert(a); 
        
        //操作元素
        //操作内容
            //非表单元素    只能通过ID找
            //a.innerText = "hello"; 取值
            //a.innerHTML = "<span style='color:red'>world</span>"; 赋值
            //表单元素  赋值 取值
            //a.value = "hello";
        //操作属性
            //a.setAttribute("bs","1");
            //a.getAttribute("bs");
            //a.removeAttribute("bs");
        //操作样式    样式表里的样式和js里的样式不一样;js只能获取内联的
            //a.style.color = red;
        
        //三个DIV隐藏
        //找到后交给一个变量存起来
        /*var a = document.getElementsByClassName("aa");
        
        for(var i=0;i<a.length;i++)
        {
            a[i].style.display = "none";
        }*/
        
        //事件    在标签里面直接加
        
        /**************************************************/
        
        //Jquery
        //根据ID找元素,取到的是JQUERY对象;$是选取元素的方法
        //var b = $("#a1");
        
        //根据CLASS取
        //var b = $(".aa");
        //alert(b.eq(0)); //取jquery对象用eq()取元素本身用[]
        
        //根据标签名取
        //var b = $("div");
        
        //根据属性筛选
        //var b = $("[name=aa]");
        
        //操作元素
        //操作内容    取值不给参数,赋值给参数
            //非表单元素
            //b.text();
            //b.html();
            //表单元素
            //b.val();
        //操作属性
            //b.attr("bs","1");    设置属性
            //b.attr("bs");    获取属性
            //b.removeAttr("bs"); 移除属性
        //操作样式    jquery还可以获取内嵌的和外部的
            //alert(b.css("color"));
            //b.css("font-size","50px");
         
        //alert(b[0]);  //取jquery对象用eq()取元素本身用[]
        
        
        //隐藏三个元素
        //$(".aa").css("display","none");
        
        //Jquery【加】事件    先找元素,找到之后挂上事件;     document:页面文档    匿名函数:function(e) {}    一般还是使用加
            
        //页面加载完成之后执行的事件    "#a1" 代表事件源 e代表事件数据
        $(document).ready(function(e) {
            
            /*//给a1加点击client
            $("#a1").click(function(){
                    alert('aa');
                })
            //给class为aa的所有元素加事件
            $(".aa").click(function(){
                    //alert($(this).attr("bs"));
                    $(".aa").css("background-color","#39F");
                    $(this).css("background-color","red");
                })*/
                
            //第二种方式【挂】事件 bind("要绑定的事件名",执行的方法)      unbind("要移除的事件名")
            $("#b1").click(function(){
                    
                    $("#a1").bind("click",function(){
                        
                        alert("我是挂上的事件");
                        
                        });
                
                })
            $("#b2").click(function(){
                
                    $("#a1").unbind("click");
                })
                
            
            
        });
        
        
        
        
        
    </script>
    
    
    
    </body>
    </html>
    1108testjs.php
  • 相关阅读:
    完美数据迁移-MongoDB Stream的应用
    补习系列(3)-springboot中的几种scope
    补习系列(2)-springboot mime类型处理
    hdfs directory item limit
    git-format-patch
    SPARK-18560
    hdfs OutOfMemoryError
    hdfs 路径不支持‘:’
    java.io.UTFDataFormatException: encoded string too long:
    scala-maven-plugin excludes
  • 原文地址:https://www.cnblogs.com/zsczsc/p/6120219.html
Copyright © 2020-2023  润新知