• jquery


    $(function(){

    });  ;

    是由$(); 

    和function(){

    }  的组合。这是为了防止文档在完全加载之前运行jquery代码。就不会出现获益一个还没有加载好的图片的情况,还有另一种写法就是$(document).ready(function(){});它也是由两个部分组成,$(document).ready();   和function(){}


    jQuery通过$("#id")就可以获取元素节点。document.getElementById获得的是DOM里的元素节点,而通过$("#id")获取到的是一个jQuery对象

    <script src="https://how2j.cn/study/jquery.min.js"></script>
    
    <script>
    $(function(){
       $("#b1").click(function(){
          $("#d").hide();
       });
       $("#b2").click(function(){
          $("#d").show();
       });
    });
    </script>
    <button id="b1">隐藏div</button>
    
    <button id="b2">显示div</button>
    <br>
    <br>
    <div id="d">
    这是一个div
    </div>
    

      

    <script src="https://how2j.cn/study/jquery.min.js"></script>
    
    <script>
    $(function(){
       $("#b1").click(function(){
          $("#d").addClass("pink");
       });
     
    });
     
    </script>
      <button id="b1">增加背景色</button>
    <br>
    <br>
    
    <style>
    .pink{
       background-color:pink;
    }
    </style>
     
    <div id="d">
     
    Hello JQuery
     
    </div>
    

      通过css函数 直接设置样式

     
    css(property,value)
     


    第一个参数是样式属性,第二个参数是样式值

     
    css({p1:v1,p2:v2})
     


    参数是 {} 包含的属性值对。
    属性值对之间用 逗号,分割
    属性值之间用 冒号 :分割
    属性和值都需要用引号 “

    <script src="https://how2j.cn/study/jquery.min.js"></script>
     
    <script>
    $(function(){
       $("#b1").click(function(){
          $("#d1").css("background-color","pink");
       });
      
       $("#b2").click(function(){
          $("#d2").css({"background-color":"pink","color":"green"});
       });
    
    });
      
    </script>
      <button id="b1">设置单一样式</button>
      <button id="b2">设置多种样式</button>
    <br>
    <br>
     
    <div id="d1" >
      
    单一样式,只设置背景色
      
    </div>
    
    <div id="d2" >
      
    多种样式,不仅设置背景色,还设置字体颜色
      
    </div>
    

      


    jquery有多个选择器,可以按照元素、id、类、层级、先后、奇偶、属性、表单对象、表单对象属性、当前元素(this 关键字)等进行选择

    https://how2j.cn/k/jquery/jquery-selector/468.html#nowhere

    筛选器


    原来以前老师使用的是BootStrap 啊,我去这玩意挺强大的, 可以在实例中美化页面

  • 相关阅读:
    新闻网站个人中心(头像修改)流程分析
    新闻网站个人中心(个人信息修改)流程分析
    新闻网站个人中心(用户信息页面展示)流程分析
    Flask上下文
    SQLALchemy
    日志
    flask_script扩展包的作用
    四个session
    汇编学习笔记(2) -- 寄存器(内存访问),数据段和栈
    汇编学习笔记(1) -- 计算机简单结构与寄存器
  • 原文地址:https://www.cnblogs.com/tao7/p/12255604.html
Copyright © 2020-2023  润新知