JS添加刪除DIV的簡(jiǎn)單實(shí)例
更新時(shí)間：2016年07月08日 11:16:13 投稿：jingxian
下面小編就為大家?guī)?lái)一篇JS添加刪除DIV的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
JS添加刪除DIV的簡(jiǎn)單實(shí)例
function addDiv(w,h){
//如果原來(lái)有“divCell”這個(gè)圖層，先刪除這個(gè)圖層
deleteDiv();
//創(chuàng)建一個(gè)div
var my = document.createElement("divCell");
//添加到頁(yè)面
document.body.appendChild(my);
//通過(guò)樣式指定該div的位置方式,若是想要自己設(shè)置div的位置,這句話必須有,把它注釋掉你就可以知道效果拉~試試看
my.style.position="absolute";
//通過(guò)樣式指定x坐標(biāo)(隨機(jī)數(shù)0~450)
my.style.top= Math.round(Math.random()*450);
//通過(guò)樣式指定y坐標(biāo)(隨機(jī)數(shù)0~700)
my.style.left= Math.round(Math.random()*700);
//通過(guò)樣式指定寬度
my.style.width=w;
//通過(guò)樣式指定高度
my.style.height=h;
//通過(guò)樣式指定背景顏色,,若是背景圖片 例為my.style.backgroundImage="url(img/3.jpg)"
my.style.backgroundColor="#ffffcc";
//添加div的內(nèi)容
//my.innerHTML=i++;
//設(shè)置樣式透明
my.style.filter = "alpha(opacity=50)";
//設(shè)置ID
my.id = "divCell";
}
function deleteDiv()
{
var my = document.getElementById("divCell");
if (my != null)
my.parentNode.removeChild(my);
}
以上這篇JS添加刪除DIV的簡(jiǎn)單實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
javascript檢測(cè)瀏覽器的縮放狀態(tài)實(shí)現(xiàn)代碼
這篇文章主要介紹了javascript檢測(cè)瀏覽器的縮放狀態(tài)實(shí)現(xiàn)代碼,需要的朋友可以參考下2014-09-09
js調(diào)試工具console.log()方法查看js代碼的執(zhí)行情況
以往都是使用alert的方式查看js代碼的執(zhí)行情況，今天看到有朋友使用console.log函數(shù)打印輸出函數(shù),變量,對(duì)象,下邊就console.log的使用情況進(jìn)行記錄2014-08-08
JavaScript中改變this指向的三種方式總結(jié)
this?指向的值是可以通過(guò)手動(dòng)方式去改變的,比如call、bind、apply方法,本文主要為大家介紹了這三種方式的具體實(shí)現(xiàn)步驟,需要的可以參考下2023-12-12
JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之棧詳解
棧作為一種數(shù)據(jù)結(jié)構(gòu),是一種只能在一端進(jìn)行插入和刪除操作的特殊線性表,也成稱為先進(jìn)后出表,下面這篇文章主要給大家介紹了關(guān)于JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之棧的相關(guān)資料,需要的朋友可以參考下2022-06-06
如何使用moment.js獲取本周、前n周、后n周開(kāi)始結(jié)束日期及動(dòng)態(tài)計(jì)算周數(shù)
使用了momentjs之后發(fā)現(xiàn)這個(gè)日期處理控件實(shí)在是太強(qiáng)大了,下面這篇文章主要給大家介紹了關(guān)于如何使用moment.js獲取本周、前n周、后n周開(kāi)始結(jié)束日期及動(dòng)態(tài)計(jì)算周數(shù)的相關(guān)資料,需要的朋友可以參考下2022-09-09
用原生js做個(gè)簡(jiǎn)單的滑動(dòng)效果的回到頂部
很多網(wǎng)頁(yè)在下方都會(huì)放置一個(gè)“返回頂部”按鈕，這樣可以幫助訪客重新找到導(dǎo)航或者重溫一遍廣告，于是將返回頂部功能做成了滑動(dòng)效果2014-10-10
JavaScript數(shù)組排序功能簡(jiǎn)單實(shí)現(xiàn)
這篇文章主要介紹了JavaScript數(shù)組排序功能簡(jiǎn)單實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-05-05
BootStrap Validator 根據(jù)條件在JS中添加或移除校驗(yàn)操作
這篇文章主要介紹了BootStrap Validator 根據(jù)條件在JS中添加或移除校驗(yàn)的相關(guān)資料,需要的朋友可以參考下2017-10-10
在?JavaScript?中,事件冒泡是指事件從觸發(fā)元素向上傳播到其祖先元素的過(guò)程,阻止事件冒泡可以防止事件傳播到父元素或其他祖先元素,本文給大家介紹了JavaScript阻止事件冒泡的幾種方法,需要的朋友可以參考下2025-03-03
CSDN上快速結(jié)貼的方法，JS實(shí)現(xiàn)
CSDN上快速結(jié)貼的方法，JS實(shí)現(xiàn)...2007-03-03