zoukankan      html  css  js  c++  java
  • 初学 jQuery样式-选择器。

        前言:做Web开发的我们,需要对页面进行美化,我们不仅要学会如何设计页面布局页面,还要学会给页面标签添加各种各样样式让用户有极好的体验感。

     一,jquery对样式的操作

            1.设置获取样式css()。

    <html>
     <body>
        <input type="button" value="获取" id="get"/>
        <input type="button" value="设置" id="set"/>
        <div id="div1" style="200px"></div>
        <div id="div2" style="300px"></div>
        <div id="div3" style="400px"></div>
     </body>
    </html>
    //引入jquery jar包
    <script src="jquyer-1.12.4.js"></script>
     <script>
    //函数入口
      $(function(){
     1.获取样式
     $("get").click(function(){
       //获取div1的样式:css()参数设置为要获取值的样式名,
      console.log($("div1").css('width'))
      console.log($("div1").css('heigth'))  
      console.log($("div1").css('border'))
       //在ie浏览器中要获取边框这样的样式值需要给一个准确边框,
      console.log($("div1").css('border-top-width'))
     1.2获取为div的元素们。
      console.log($("div").css('width'))//注意:获取包含了多个domy元素的jquery对象的样式,它将会返回第一个元素对应的样式值
      })
     2.设置样式
     $("set").click(function(){
       //设置样式需要给css()方法样式名和样式值, 这里设置的是行内样式。
     2.1为id为div1的元素设置样式
      $(div1).css('width':'100px")(两种写法1:直接写100不需要单引号,2:100px需要加上单引号)
     2.2设置多样式。
       //是对象属性名可以不带引号如果带'—'需要加上引号
      $('div1').css({
        100,
       'background-color':'red'
    
      })
    
     })
    
    })
    </scrpit> 

    二,选择器。

      1.基本选择器  -- 和css里的选择器一样的。

          id选择器:      $('#id'),

          类选择器:     $('.class'),

          标签选择器: $('标签'),

          并集选择器: $('.id,.div'),

          交集选择器: $('li.div'),

      2.层次选择器。

     3.过滤选择器

       这类选择器都带 ":"

     

     

  • 相关阅读:
    字符串时间+8个小时
    Django的field字段与参数介绍
    celery+Django
    二分查找
    排序算法
    socket套接字
    网络七层协议简述
    ORM操作mysql数据库多表的增删改查
    ORM操作mysql数据库
    Django框架静态文件配置和URL解析
  • 原文地址:https://www.cnblogs.com/liuhaoking/p/12176276.html
Copyright © 2011-2022 走看看