JS DOM元素
// 为element增加一个样式名为newClassName的新样式
function addClass(element, newClassName) {
var value = element.className;
element.className = value + " " + newClassName;
}
var box = document.getElementById("box");
addClass(box,'js')
// 移除element中的样式oldClassName
function removeClass(element, oldClassName) {
var value = element.className;
var str = value.replace(oldClassName,"");
element.className = str;
}
var box = document.getElementById("box");
console.log(removeClass(box,"active"));
// 判断siblingNode和element是否为同一个父元素下的同一级的元素,返回bool值
function isSiblingNode(element, siblingNode) {
return element.parentNode===siblingNode.parentNode;
}
var box1 = document.getElementById("box1");
var box2 = document.getElementById("box2");
console.log(isSiblingNode(box1,box2))
// 获取element相对于浏览器窗口的位置,返回一个对象{x, y}
function getPosition(element) {
return {
x:element.offsetLeft,
y:element.offsetTop
};
}
var box1 = document.getElementById("box1");
console.log(getPosition(box1));
JS DOM元素的更多相关文章
- 获取 js DOM元素中绑定的所有事件,模仿 chrome getEventListeners
偶尔看到了这个问题,如何用JS获取元素某一事件上绑定的所有Listener? 突然觉得好像是有解决办法的,查了下,在 chrome 下,支持 window.getEventListeners(obj) ...
- JS DOM元素的操作(创建,添加,删除,和修改属性)
1.1 创建 DOM 元素以及相应的追加方式 1.1.1 创建:document.createElement('div'); 添加: fatherEle.appendChild(ele); appe ...
- js DOM 元素ID就是全局变量
有人在twitter上提到了:在Chrome的JavaScript终端中,你只需要输入一个元素的ID,就可以访问到这个元素.@johnjbarton给了解释,这是因为所有的元素ID都是全局变量.本文再 ...
- js dom元素加载完成执行
//dom ready执行 function ready(fn){ if(document.addEventListener){ document.addEventListener('DOMConte ...
- JS1 js获取dom元素方法
js获取dom元素方法 1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId") 其 ...
- JS DOM 来控制HTML元素
JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- riot.js教程【三】访问DOM元素、使用jquery、mount输入参数、riotjs标签的生命周期
前文回顾 riot.js教程[二]组件撰写准则.预处理器.标签样式和装配方法 riot.js教程[一]简介 访问DOM元素 你可以通过this.refs对象访问dom元素 而且还有大量的属性简写方式可 ...
- JS添加或删除HTML dom元素的方法实例分析
本文实例讲述了JS代码添加或删除HTML dom元素的方法.分享给大家供大家参考,具体如下: 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一 ...
- 详解JS中DOM 元素的 attribute 和 property 属性
一.'表亲戚':attribute和property 为什么称attribute和property为'表亲戚'呢?因为他们既有共同处,也有不同点. attribute 是 dom 元素在文档中作为 h ...
随机推荐
- Jquery+artTemplate+layPage 封装datagrid
导言 在日常开发中经常会用到列表,相信用过easyui,Ext等很多,的确很强大,但想修改确实也不容易,我也用了几年的easyui,有时间时会想一下,自已随然没有前端的精湛技术,但可以在有这些技术的开 ...
- ubuntu 12.04 安装Docker 实战
2016-3-8 从网络服务商那里申请到一台Ubuntu测试服务器,用来测试安装Docker环境. 注:本人初学Docker,对Linux命令也仅是稍稍了解,如有错误,烦请告知. 查看系统相关信息 可 ...
- Python一点注意
1. pickle pickle模块中的两个主要函数是dump()和load().dump()函数接受一个文件句柄和一个数据对象作为参数,把数据对象以特定的格式保存到给定的文件中.当我们使用load( ...
- 正则指引-量词demo
class Program { static void Main(string[] args) { string str = "1\"3"; var re1 = Rege ...
- 使用shiro的SimpleHash来生成常用的摘要串
<dependency> <groupId>org.apache.shiro</groupId> <artifactId>shiro-core</ ...
- Asp.net Core WebApi 支持json/xml格式的数据返回
Asp.net core 在做webapi项目的时候,默认是只返回json格式的数据的,如果想要开启xml数据返回,需要在startup里配置如下: public void ConfigureServ ...
- (原)win8下编译GLUT
1.到opengl官网下载glut源代码 2.修改glutwin32.mak下 # MSVC install directoriesLIBINSTALL = XXXXX\VC\lib //vs ...
- win7搭建ios开发环境
安装过程参考文章: http://jingyan.baidu.com/article/ff411625b9011212e48237b4.html http://www.loukit.com/threa ...
- 操作系统性能分析与优化V1.0
操作系统性能分析与优化V1.0 : http://www.docin.com/p-759561760.html
- Jquery中使用setInterval和setTimeout会提示缺少对象的错误,解决方法如下:
直接在ready中调用其他方法,会提示缺少对象的错误,解决方法如下: 方法1. 应用jQuery的扩展可以解决这个问题. $(document).ready(function(){ $.extend( ...