JS学习笔记Day10
一、设置或获取元素对象中(标签中)的属性和自定义属性
对象.属性
对象['属性']
对象.getAttribute('属性名')
对象.setAttribute('属性名','属性值');
对象.removeAttribute('属性名')
二、outerHTML : 当前节点对象及所有子节点(标签及所有内容)
innerHTML : 当前节点中所有的内容(包含标签,会自动解析标签)
innerText : 当前节点中所有的纯文本内容(不包含标签,不会自动解析标签)
三、如何获取所有的子节点?
1. childNodes : 元素节点与文本节点(需要去除空白文本节点)
function removeSpace(node){
var childs = node.childNodes;
for(var i = 0;i < childs.length;i ++){
if(childs[i].nodeType === 3 && /^\s+$/.test(childs[i].nodeValue)){
node.removeChild(childs[i]);
}
}
return node;
}
2. children : 元素子节点
四、高级选取
parentNode
firstChild
firstElementChild
lastChild
lastElementChild
previousSibling
previousElementSibling
nextSibling
nextElementSibling
五、offsetWidth = width + border + padding
offsetHeight = height + border + padding
六、获取非行内样式
function getStyle(obj,attr){
return window.getComputedStyle ? getComputedStyle(obj,1)[attr] : obj.currentStyle[attr];
}
七、父节点.insertBefore(newNode,oldNode)
八、offsetLeft : 指定对象相对于父对象的left值
offsetTop : 指定对象相对于父对象的top值
JS学习笔记Day10的更多相关文章
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- Vue.js学习笔记(2)vue-router
vue中vue-router的使用:
- JS 学习笔记--9---变量-作用域-内存相关
JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...
- WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)
WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...
- WebGL three.js学习笔记 法向量网格材质MeshNormalMaterial的介绍和创建360度全景天空盒的方法
WebGL学习----Three.js学习笔记(5) 点击查看demo演示 Demo地址:https://nsytsqdtn.github.io/demo/360/360 简单网格材质 MeshNor ...
- WebGL three.js学习笔记 创建three.js代码的基本框架
WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的 ...
- vue.js 学习笔记3——TypeScript
目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...
- 2019-4-29 js学习笔记
js学习笔记一:js数据类型 1:基本数据类型 number类型(整数,小数) String类型 boolean类型 NaN类型其实是一个nu ...
- 一点感悟:《Node.js学习笔记》star数突破1000+
写作背景 笔者前年开始撰写的<Node.js学习笔记> github star 数突破了1000,算是个里程碑吧. 从第一次提交(2016.11.03)到现在,1年半过去了.突然有些感慨, ...
随机推荐
- 【公众号系列】超详细SAP HANA JOB全解析
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[公众号系列]超详细SAP HANA JOB全解 ...
- python3 多线程的使用
示例1: import threadingfrom time import sleep class forThread(threading.Thread): def __init__(self, ev ...
- eclipse IDE使用git方法简单介绍
eclipse下使用git插件上传代码至github 1.eclipse下安装git eclipse git 插件的安装. 点击 Help->Install New Software-> ...
- php二维数组根据某个字段去重
php的二维数组根据某个字段去重,在这默认为二维数组的结构是一样的,现在根据二维数组里的id字段去重,把id相同的重复的元素去掉 /** * 二维数组根据某个字段去重 * @param array $ ...
- 如何在Spring Data JPA中引入Querydsl
一.环境说明 基础框架采用Spring Boot.Spring Data JPA.Hibernate.在动态查询中,有一种方式是采用Querydsl的方式. 二.具体配置 1.在pom.xml中,引入 ...
- 【Teradata UDF】中文按字符查找chs_instr
一.场景描述 数据库为ASCII编码单字节存储,在查询中文时可能会出现错误结果.例如查询like“房”字,会查询出不含“房”,含“朔科”的结果. select * from Tablename01 w ...
- 解决Error response from daemon: Get https://registry-1.docker.io/v2/library/hello-world/manifests/
https://blog.csdn.net/quanqxj/article/details/79479943
- Java多线程之ReentrantLock与Condition
一.ReentrantLock 1.ReentrantLock简介 ReentrantLock是一个可重入的互斥锁,又被称为“独占锁”.ReentrantLock 类实现了 Lock ,它拥有与 sy ...
- TensorRT&Sample&Python[uff_custom_plugin]
本文是基于TensorRT 5.0.2基础上,关于其内部的uff_custom_plugin例子的分析和介绍. 本例子展示如何使用cpp基于tensorrt python绑定和UFF解析器进行编写pl ...
- HDU-problem-1002-人类史上最大最好的希望事件-矩阵快速幂
Problem Description 作为CNCS的半壁江山,狗哥常常在宇宙中心邵阳眺望黄浦江,夜晚的星空总是迷人,有时候还能见到彗星滑落. 狗哥是幸运的,他在两秒钟内看到了十七颗彗星划过天际,作为 ...