重點:
1、基礎(chǔ)的jquery寫法,格式為:$('標(biāo)簽').css('值')
2、鏈?zhǔn)綄懛ǎ?/p>
var res=$('img')
.css('width','200px')
.css('height','200px')
.css('border-radius','50%')
3、parseInt(包裹),parseInt是用于轉(zhuǎn)化整個索引元素為數(shù)值的函數(shù)方法
4、字符串拼接: var res=$('img').css('width',res+'px')
5、+=,X+=2是等價于X=X+2
6、offset()用于獲取某個元素的偏移
7、pisition()用于獲取某個函數(shù)的定位
-
-
-
以下為代碼部分:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<img src="img/001.jpg"/>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$('img').css('width','300px')
// 最基礎(chǔ)的內(nèi)聯(lián)樣式修改方法,格式為:$('標(biāo)簽').css('值')
var res=$('img').css('width','200px')
// var res=$('img').css('width')
//以下為鏈?zhǔn)讲僮鞣椒?/p>
var res=$('img')
.css('width','200px')
.css('height','200px')
.css('border-radius','50%')
//以下為js結(jié)構(gòu)操作方法
// var res=$('img').removeAttr('style')
var res=$('img').css({
'border-radius':'50%',
'width':'200px',
'box-shadow':'2px 2px 2px black',
})
var res=$('img').removeAttr('style')
var res=parseInt($('img').css('width'))
//parseInt寫法主要包裹了某個索引,并將索引轉(zhuǎn)化為數(shù)值
res+=100
//數(shù)值res為200,res+=100等價于res=res+100(res=200+100)
var res=$('img').css('width',res+'px')
//增加寬度并使寬度賦上單位Px
console.log(res)
//
var res=$('img').width(100)
//函數(shù) width()寫法,簡單的獲取到width
res+=200
//res賦值了100,此處=300
var res=$('img').width(res+500,'px')
console.log(res)
</script>
</html>
微信掃碼
關(guān)注PHP中文網(wǎng)服務(wù)號
QQ掃碼
加入技術(shù)交流群
Copyright 2014-2025 http://ipnx.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號