4.8.2.JSDOM对象控制HTML元素详解
1
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>DOM对象控制HTML</title>
</head>
<body>
<p name="pn">hello</p>
<p name="pn">hello</p>
<p name="pn">hello</p>
<a id="aid" title="得到了a标签的属性">hello</a>
<a id="aid2">aid2</a>
<ul><li>1</li><li>2</li><li>3</li></ul>
<div id="div">
<p id="pid">div的P元素</p>
</div>
<script>
function getName() {
var count = document.getElementsByName("pn");
alert(count.length);
var p = count[2];
p.innerHTML = "World";
}
function getAttr() {
var anode = document.getElementById("aid");
var attr = anode.getAttribute("id");
alert(attr);
}
function setAttr() {
var anode = document.getElementById("aid2");
anode.setAttribute("title", "动态设置a的title属性");
var attr = anode.getAttribute("title");
alert(attr);
}
function getChildNode() {
var childnode = document.getElementsByTagName("ul")[0].childNodes;
alert(childnode.length);
alert(childnode[0].nodeType)
}
function getParentNode() {
var div = document.getElementById("pid");
alert(div.parentNode.nodeName);
}
function createNode() {
var body = document.body;
var input = document.createElement("input");
input.type = "button";
input.value = "按钮";
body.appendChild(input);
}
function addNode() {
var div = document.getElementById("div");
var node = document.getElementById("pid");
var newnode = document.createElement("p");
newnode.innerHTML = "动态添加体格p元素";
div.insertBefore(newnode, node);
}
function removeNode() {
var div = document.getElementById("div");
var p = div.removeChild(div.childNodes[1]);
}
function getSize() {
var width = document.body.offsetWidth || document.documentElement.offsetWidth;
var height = document.body.offsetHeight;
alert(width + " " + height);
}
getSize();
</script>
</body>
</html>
4.8.2.JSDOM对象控制HTML元素详解的更多相关文章
- JS DOM对象控制HTML元素详解
JS DOM对象控制HTML元素详解 方法: getElementsByName() 获取name getElementsByTagName() 获取元素 getAttribute() 获取元素 ...
- javascript - DOM对象控制HTML元素详解
1.方法 getElementsByName() -- 获取name getElementByTagName() -- 获取 getAttribute() --获取元素属性 se ...
- web前端学习(四)JavaScript学习笔记部分(7)-- JavaScript DOM对象控制HTML元素详解
1.方法 getElementsByName() 获取name 可以获取一个数组类型数据(参数加引号) getElementsByTagName() 获取元素 getAttribute() 获取元 ...
- html5中output元素详解
html5中output元素详解 一.总结 一句话总结: output元素是HTML5新增的元素,用来设置不同数据的输出,没什么大用,了解即可 <form action="L3_01. ...
- 史上最全web.xml配置文件元素详解
一.web.xml配置文件常用元素及其意义预览 <web-app> <!--定义了WEB应用的名字--> <display-name></display-na ...
- asp.net中C#对象与方法 属性详解
C#对象与方法 一.相关概念: 1.对象:现实世界中的实体 2. 类:具有相似属性和方法的对象的集合 3.面向对象程序设计的特点:封装 继承 多态 二.类的定义与语法 1.定义类: 修饰符 类名称 ...
- java对象池commons-pool-1.6详解(一)
自己的项目中用到了 对象池 commons-pool: package com.sankuai.qcs.regulation.protocol.client; import com.dianping. ...
- web.xml配置文件元素详解
一.web.xml配置文件常用元素及其意义 1 <web-app> 2 3 <!--定义了WEB应用的名字--> 4 <display-name></disp ...
- JavaScript对象的property属性详解
JavaScript对象的property属性详解:https://www.jb51.net/article/48594.htm JS原型与原型链终极详解_proto_.prototype及const ...
随机推荐
- MySQL死锁1
MySQL行级排他锁的使用及死锁解除技巧 这篇笔记存粹是做学习记录之用,方便将来查阅,老鸟请跳过.关于MySQL排他锁的具体使用. 使用排他锁 假设有一张user表如下: id name age 1 ...
- HDU3172 Virtual Friends
基础并查集~ #include<cstdio> #include<algorithm> #include<cstring> #include<unordere ...
- 吴裕雄--天生自然TensorFlow2教程:激活函数及其梯度
import tensorflow as tf a = tf.linspace(-10., 10., 10) a with tf.GradientTape() as tape: tape.watch( ...
- Ubuntu 12.10 安装vim出错
在Ubuntu 12.10中安装vim时出现了如下提示: 正在读取软件包列表... 完成正在分析软件包的依赖关系树 正在读取状态信息... 完成 有一些软件包无法被安装.如果您用的是 unstable ...
- IPSec的链路和设备备份
链路备份的IPSec VPN和设备备份的IPSec VPN:首先实验的是链路备份的 IPSec VPN,下面是实验拓扑: IP地址配置:R1(Branch):Branch(config-if)#ip ...
- Java学习资源 - 测试
JUnit注解解释 1. @Test : 测试方法,测试程序会运行的方法,后边可以跟参数代表不同的测试,如(expected=XXException.class) 异常测试,(timeout=xxx) ...
- 【PAT甲级】1059 Prime Factors (25 分)
题意: 输入一个正整数N(范围为long int),输出它等于哪些质数的乘积. trick: 如果N为1,直接输出1即可,数据点3存在这样的数据. 如果N本身是一个质数,直接输出它等于自己即可,数据点 ...
- apache 配置虚拟目录
#注释掉apache默认的网站目录地址 #DocumentRoot "c:/Rrogram Files/Apache/htdocs" #配置一个虚拟目录 <ifModule ...
- 小白学 Python 爬虫:Selenium 获取某大型电商网站商品信息
目标 先介绍下我们本篇文章的目标,如图: 本篇文章计划获取商品的一些基本信息,如名称.商店.价格.是否自营.图片路径等等. 准备 首先要确认自己本地已经安装好了 Selenium 包括 Chrome ...
- unity 热更方案对比
现在一般使用的方案有:tulua&ulua.xlua.ILRuntime 对比: tulua&ulua 方案成熟,稳定第三方库支持 xlua 之前是为了热更修复线上bug的,腾讯发起的 ...