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 ...
随机推荐
- iOS开发-友盟分享(3)
iOS 友盟分享 这个主要是提到如何通过友盟去自定义分享的步骤: 一.肯定要去友盟官网下载最新的SDK包,然后将SDK导入到你的工程文件夹里面去: 二.注册友盟账号,将你的APP添加到你的账号里面然后 ...
- java生成生成图片缩略图
/** * */ package com.fkhwl.fkhserver.core.utils; import java.awt.Image; import java.awt.image.Buffer ...
- 运用JMX监控Tomcat/Java jvisualvm简要说明
公司线上项目出现了java heap space 然后经过查询知晓了下面工具于是开始了尝试. visualvm能干什么:监控内存泄露,跟踪垃圾回收,执行时内存.cpu分析,线程分析... jvisua ...
- Leetcode 299 Bulls and Cows 字符串处理 统计
A就是统计猜对的同位同字符的个数 B就是统计统计猜对的不同位同字符的个数 非常简单的题 class Solution { public: string getHint(string secret, s ...
- hdu4508 完全背包,湫湫系列故事——减肥记I
湫湫系列故事——减肥记I 对于01背包和完全背包,昨晚快睡着的时候,突然就来了灵感 区别:dp[i][v]表示前i件物品恰放入一个容量为v的背包可以获得的最大价值 在第二重循环,01 是倒着循环的,因 ...
- C#下取得Exif中照片拍摄日期
/// <summary> /// 获取Exif中的照片拍摄日期 /// </summary> /// <param name="fileName"& ...
- React学习资料
以下是我整理的React学习资料,包括:React基础.Redux.reat-router, redux middleware, higher order components, React验证等, ...
- Javacript和AngularJS中的Promises
promise是Javascript异步编程很好的解决方案.对于一个异步方法,执行一个回调函数. 比如页面调用google地图的api时就使用到了promise. function success(p ...
- Java中BigDecimal的8种舍入模式
java.math.BigDecimal 不可变的.任意精度的有符号十进制数.BigDecimal 由任意精度的整数非标度值和32位的整数标度(scale)组成. 如果为零或正数,则标度是小数点后的位 ...
- 杀死O2O的三大杀手?!
0个O2O领域,20多个“已故”项目,三种不同的死因……记者糜丰.孙锋将O2O项目的一些固有问题分析得淋漓尽致! 这三个O2O杀手分别是:买不起的流量.承担不起的物流成本.惹不起的传统企业. 除了找钱 ...