js指定diva样式（定义div样式）

小蓝 • 2024-12-12 11:58 • 编程

本文目录一览：

1、如何利用js向指定位置添加一个div层
2、如何利用js向指定位置添加一个div层？
3、用JS怎么写一个点击按钮就可以改变指定div的ID或者class名呢
4、怎么让js代码只作用在指定的范围（比如指定的div）

如何利用js向指定位置添加一个div层

1、利用js代码首先创建一个div，document.createElement(‘div’);

2、确认div添加位置，可以在某个dom元素后面，或者通过css属性控制具体位置，主要通过left/top等属性控制。

3、确定位置之后，显示div即可。

示例：比如html中有一个文本输入框，我们现在需要在挨着输入框右下角位置显示一个div。

input type=”text” id=”city” value=”beijing”/

方法：

function createDiv(){

//首先创建div

var descDiv = document.createElement(‘div’);

document.body.appendChild(descDiv);

//获取输入框dom元素

var text = document.getElementById(‘city’);

//计算div的确切位置

var seatX = text.offsetLeft + text.offsetWidth;//横坐标

var seatY = text.offsetTop + text.offsetHeight;//纵坐标

//给div设置样式，比如大小、位置

var cssStr = “z-index:5;width:420px;height:300px;background-color:#FFFF99;border:1px solid black;position:absolute;left:”

+ seatX + ‘px;top:’ + seatY + ‘px;’;

//将样式添加到div上，显示div

descDiv.style.cssText = cssStr;

descDiv.innerHTML = ‘这是一个测试的div显示的内容’;

descDiv.id = ‘descDiv’;

descDiv.style.display = ‘block’;

}

如何利用js向指定位置添加一个div层？

把外链接的JS加载到body后面，在这个JS里面用类似这样的代码：

var div = document.createElement(‘div’); // 新增元素

var diva = document.getElementById(‘a’); // 获取id为a的元素

diva.parentNode.insertBefore(div, diva); // 在这个元素前面增加上去

用JS怎么写一个点击按钮就可以改变指定div的ID或者class名呢

!DOCTYPE html

html

head

style

.c1{

background:red;

}

.c2{

background:blue;

}

/style

/head

body

script

function changeclass(){

var divEle= document.getElementById(‘diva’);

divEle.className=’c2′;//改变样式

divEle.id=’cccc’;//改变id

var divEle2= document.getElementById(‘cccc’);

alert(“停顿”);

divEle.className=’c1′;

}

/script

div id=’diva’ class=’c1’111/div

input type=’button’ onclick=’changeclass()’ value=’改变样式’/

/body

/html

怎么让js代码只作用在指定的范围（比如指定的div）

在js或者jQuery下面得到指定的div下面的指定a标签的方法：1、通过id直接获取所需a标签：$(“#ids”);2、通过从属关系获得a标签。$(“diva”);然后对取得的元素遍历，找到需要的a标签即可。

原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/236188.html