1，一個div多個背景色
background: url(圖片) no-repeat 95% 50%, -webkit-linear-gradient(#fff, #eee 50%,#ddd);
2,jq點擊獲取div中的內容------index-------屬性值
1.獲取ID屬性值：event.currentTarget.id
2.獲取自定義data-屬性值：event.currentTarget.dataset.name----- （data-name）
3.獲取div裏的內容2種方法： html() text()
4.獲取當前操作下標2種方法：$(this).index() $('.div1').index(this)
5.獲取自定義屬性包括已有屬性的屬性值：.attr("屬性名")
例子如下：
html代碼：
<body>
<div class="div1" id='1' data-index='0' haha='333333'>張三</div>
<div class="div1" id='2' data-index='1' haha='444444'>李四</div>
<div class="div1" id='3' data-index='2' haha='444444'>王五</div>
</body>
js代碼：
$('.div1').click(function(event) {
var event=event||e;
console.log(event.currentTarget.id); //獲取id屬性值
console.log(event.currentTarget.dataset.name); //獲取自定義data-屬性值
//獲取div裏的值 2種方法
console.log($(this).html());
console.log($(this).text());
//獲取自定義屬性的屬性值
console.log($(this).attr("haha"));
//獲取當前操作下標
console.log($(this).index());
console.log($('.div1').index(this));
});
3.jq獲取div的屬性值
<div class="item lottery-unit lottery-unit-5" data-id="{$draw.good5.id}"> <div class="img"> <img src="{$draw.good6.litpic}" alt=""> </div> <span class="name">{$draw.good6.title}</span> </div>var id=$('.lottery-unit.lottery-unit-' + snum).attr('data-id'); console.log(ee);
4.jq獲取當前頁面url
設置或獲取對象指定的文件名或路徑。
window.location.pathname
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.pathname); 則輸出：/topic/index
設置或獲取整個 URL 爲字符串。
window.location.href
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.href); 則輸出：http://localhost:8086/topic/index?topicId=361
設置或獲取與 URL 關聯的端口號碼。
window.location.port
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.port); 則輸出：8086
設置或獲取 URL 的協議部分。
window.location.protocol
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.protocol); 則輸出：http:
設置或獲取 href 屬性中在井號“#”後面的分段。
window.location.hash
設置或獲取 location 或 URL 的 hostname 和 port 號碼。
window.location.host
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.host); 則輸出：http:localhost:8086
設置或獲取 href 屬性中跟在問號後面的部分。
window.location.search
例：http://localhost:8086/topic/index?topicId=361
alert(window.location.search); 則輸出：?topicId=361
window.location
屬性 描述
hash 設置或獲取 href 屬性中在井號“#”後面的分段。
host 設置或獲取 location 或 URL 的 hostname 和 port 號碼。
hostname 設置或獲取 location 或 URL 的主機名稱部分。
href 設置或獲取整個 URL 爲字符串。
pathname 設置或獲取對象指定的文件名或路徑。
port 設置或獲取與 URL 關聯的端口號碼。
protocol 設置或獲取 URL 的協議部分。
search 設置或獲取 href 屬性中跟在問號後面的部分。
5.獲取子元素的屬性值
<ul class=" list-paddingleft-2">
<li>
<p style="line-height: 16px;">
<img style="margin-right: 2px; vertical-align: middle;" src="http://xxx.gif">
<a title="xxx.doc" style="xxx" href="http://xxx.doc">
<span style="xxx">xxx.doc</span>
</a>
</p>
</li>
</ul>
<script>
$(".list-paddingleft-2").on("click","li",function(){
//只需要找到你點擊的是哪個ul裏面的就行
console.log($(this))
console.log($(this).children('p').children('a').attr('title'))
});
</script>
6
移動端 ios 用div寫的點擊事件 點擊有延遲 需添加 cursor: pointer;屬性 或者選擇用button進行事件操作
document.documentElement.clientWidth;
document.documentElement.clientHeight;
8.頁面加載時給的子元素的第一個元素加class
<div id="xiao">
<ul>
<li></li>
</ul>
</div>
js代碼：
<script>
$(function () {
$('#xiao').children().eq(0).attr('id','tree');
// console.log($('#d').children().eq(0).attr('id'));
$("#tree").treeview({
collapsed: true,
animated: "medium",
control: "#sidetreecontrol",
persist: "location"
});
})
</script>
9. div 自適應高度 自動填充剩餘高度 參考：https://www.cnblogs.com/pangguoming/p/5695184.html
<div class="outer">
<div class="A">頭部DIV</div>
<div class="B">下部DIV</div>
</div>
body { height: 100%; padding: 0; margin: 0; }
.outer { height: 100%; padding: 100px 0 0; box-sizing: border-box ; }
.A { height: 100px; margin: -100px 0 0; background: #BBE8F2; }
.B { height: 100%; background: #D9C666; }
10獲取CheckBox是否選中
$(this).is(':checked')//獲取CheckBox是否選中