Java学习者论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

手机号码,快捷登录

恭喜Java学习者论坛(https://www.javaxxz.com)已经为数万Java学习者服务超过8年了!积累会员资料超过10000G+
成为本站VIP会员,下载本站10000G+会员资源,购买链接:点击进入购买VIP会员
JAVA高级面试进阶视频教程Java架构师系统进阶VIP课程

分布式高可用全栈开发微服务教程

Go语言视频零基础入门到精通

Java架构师3期(课件+源码)

Java开发全终端实战租房项目视频教程

SpringBoot2.X入门到高级使用教程

大数据培训第六期全套视频教程

深度学习(CNN RNN GAN)算法原理

Java亿级流量电商系统视频教程

互联网架构师视频教程

年薪50万Spark2.0从入门到精通

年薪50万!人工智能学习路线教程

年薪50万!大数据从入门到精通学习路线年薪50万!机器学习入门到精通视频教程
仿小米商城类app和小程序视频教程深度学习数据分析基础到实战最新黑马javaEE2.1就业课程从 0到JVM实战高手教程 MySQL入门到精通教程
查看: 951|回复: 0

jQuery CSS 函数

[复制链接]

该用户从未签到

发表于 2011-7-31 16:56:36 | 显示全部楼层 |阅读模式
jQuery csscsscsscsscsscsscsscsscsscssHTMLjavajavacSSHtmlcsscsscsscsshtmljavajavacsshtmlcsscsscsscsshtmljavajavahtmlcsshtmlhtmljavajavahtmlhtmljavajavahtmlcsscss 操纵


jQuery 拥有三种供 操纵的重要函数:


    [li]$(selector).(name,value)
    [li]$(selector).({properties})
    [li]$(selector).(name) [/li]



操纵实例

函数 (name,value) 为所有匹配元素的给定 属性设置值:

实例
[pre]$(selector).(name,value)
$("p").("background-color","yellow");
[/pre]
TIY  

<>
<head>
<script type="text/script" src="/jquery/jquery.js"></script>
<script type="text/script">
$(document).ready(function(){
  $("button").click(function(){
    $("p").("background-color","yellow");
  });
});
</script>
</head>

<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>

</>


函数 ({properties}) 同时为所有匹配元素的一系列 属性设置值:

实例
[pre]$(selector).({properties})
$("p").({"background-color":"yellow","font-size":"200%"});
[/pre]
TIY   

<>
<head>
<script type="text/script" src="/jquery/jquery.js"></script>
<script type="text/script">
$(document).ready(function(){
  $("button").click(function(){
    $("p").({"background-color":"yellow","font-size":"200%"});
  });
});
</script>
</head>

<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>

</>


函数 (name) 返回指定的 属性的值:

实例
[pre]$(selector).(name)
$(this).("background-color");
[/pre]
TIY   

<>
<head>
<script type="text/script" src="/jquery/jquery.js"></script>
<script type="text/script">
$(document).ready(function(){
  $("div").click(function(){
  $("#result").($(this).("background-color"));
  });
});
</script>
</head>

<body>
<div style="width:100px;height:100px;
background:#ff0000"></div>
<p id="result">Click in the box</p>
</body>
</>




jQuery Size 操纵

jQuery 拥有两种供尺寸操纵的重要函数:


    [li]$(selector).height(value)
    [li]$(selector).width(value) [/li]



Size 操纵实例

函数 height(value) 设置所有匹配元素的高度:

实例
[pre]$(selector).height(value)
$("#id100").height("200px");
[/pre]
TIY  

<>
<head>
<script type="text/script" src="/jquery/jquery.js"></script>
<script type="text/script">
$(document).ready(function(){
  $("button").click(function(){
    $("#id100").height("200px");
  });
});
</script>
</head>

<body>
<div id="id100" style="background:yellow;height:100px;width:100px">
HELLO</div>
<div id="id200" style="background:yellow;height:100px;width:100px">
gjrencai.com</div>
<button type="button">Click me</button>
</body>

</>


函数 width(value) 设置所有匹配元素的宽度:

实例
[pre]$(selector).width(value)
$("#id200").width("300px");
[/pre]
TIY   

<>
<head>
<script type="text/script" src="/jquery/jquery.js"></script>
<script type="text/script">
$(document).ready(function(){
  $("button").click(function(){
  $("#id200").width("300px");
  });
});
</script>
</head>

<body>
<div id="id100" style="background:yellow;height:100px;width:100px">HELLO</div>
<div id="id200" style="background:yellow;height:100px;width:100px">gjrencai.com</div>
<button type="button">Click me</button>
</body>

</>




jQuery 函数 - 来自本页

css 属性描述
$(selector).css(name,value)为匹配元素设置样式属性的值
$(selector).css({properties})为匹配元素设置多个样式属性
$(selector).css(name)获得第一个匹配元素的样式属性值
$(selector).height(value)设置匹配元素的高度
$(selector).width(value)设置匹配元素的宽度

(selector) jQuery 元素选择器语法

如需完整的参考手册,请访问我们的 jQuery 函数参考手册。
回复

使用道具 举报

  • TA的每日心情
    开心
    2021-3-12 23:18
  • 签到天数: 2 天

    [LV.1]初来乍到

    发表于 2011-7-31 17:04:16 | 显示全部楼层
    谢谢楼主分享。
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    QQ|手机版|Java学习者论坛 ( 声明:本站资料整理自互联网,用于Java学习者交流学习使用,对资料版权不负任何法律责任,若有侵权请及时联系客服屏蔽删除 )

    GMT+8, 2024-5-24 01:05 , Processed in 0.326028 second(s), 38 queries .

    Powered by Discuz! X3.4

    © 2001-2017 Comsenz Inc.

    快速回复 返回顶部 返回列表