DOM属性节点加其他节点的操作
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="box" a="10" b=20 id="cont" title="这是一个div">hello<!--这是一个注释-->></div> </body>
<script> var obox = document.querySelector(".box")//通过元素属性操作
console.log(obox.attributes);//显示元素的内置属性
console.log(obox.attributes[0].class); //undefined
console.log(obox.attributes[1].a); //undefined
console.log(obox.attributes[2]); //b="20"
console.log(obox.attributes[3]); //id="cont"
console.log(typeof obox.attributes[3]); object console.log(obox.attributes[2]); //b="20"
console.log(obox.attributes[2].nodeName); //b
console.log(obox.attributes[2].nodeValue); //20
console.log(obox.attributes[2].nodeType);//2 console.log(obox.nodeName)
console.log(obox.nodeValue)
console.log(obox.nodeType) console.log(typeof obox.childNodes[0])
console.log(obox.childNodes[0])
console.log(obox.childNodes[0].nodeName)
console.log(obox.childNodes[0].nodeValue)
console.log(obox.childNodes[0].nodeType) console.log(obox.childNodes[1])
console.log(obox.childNodes[1].nodeName)
console.log(obox.childNodes[1].nodeValue)
console.log(obox.childNodes[1].nodeType) console.log(document)
console.log(document.nodeName)
console.log(document.nodeValue)
console.log(document.nodeType) // 伪数组：假数组，可以使用索引和长度遍历
// 但是不能使用数组的方法
// 所有的DOM选择器，返回的数组，都是伪数组
// arguments
//
// 真数组：既能通过索引和长度遍历，也可以使用数组的方法 </script>
</html>
DOM属性节点加其他节点的操作的更多相关文章
- jQuery 源码分析(十三) 数据操作模块 DOM属性 详解
jQuery的属性操作模块总共有4个部分,本篇说一下第2个部分:DOM属性部分,用于修改DOM元素的属性的(属性和特性是不一样的,一般将property翻译为属性,attribute翻译为特性) DO ...
- JavaScript 节点操作Dom属性和方法(转)
JavaScript 节点操作Dom属性和方法 一些常用的dom属性和方法,列出来作为手册用. 属性: 1.Attributes 存储节点的属性列表(只读) 2.childNodes 存储 ...
- JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}
前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...
- jacascript DOM节点——元素节点、属性节点、文本节点
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! DOM节点的三个种类:元素节点.文本节点.属性节点: 元素节点 元素节点就是 HTML 标签元素,元素节点 ...
- DOM属性/节点属性
DOM属性:DOM(Document Object Model,文档对象模型)一种独立于语言,用于操作xml,html的应用编程接口1:获取节点: document.getElementById(id ...
- JS学习之DOM节点的关系属性封装、克隆节点、Dom中Style常用的一些属性等小结
JS DOM节点: 在JS DOM中节点的关系被定义为节点的属性: 通常有以下几种节点之间的关系: (这里的关系是所有浏览器都支持的) parentNode 父节点 childNodes ...
- DOM中元素节点、属性节点、文本节点
DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...
- DOM中元素节点、属性节点、文本节点的理解
DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) ...
- 使用DOM解析XML文件，、读取xml文件、保存xml、增加节点、修改节点属性、删除节点
使用的xml文件 <?xml version="1.0" encoding="GB2312" ?> <PhoneInfo> <Br ...
- 一波儿networkx 读写edgelist，给节点加attribute的操作
一波儿networkx 读写edgelist,给节点加attribute的操作 read more: nx official: Reading and writing graphs import nu ...
随机推荐
- kubectl工具安装指南
kubectl是一个用于连接Service Mesh控制平面的工具,可以安装在办公电脑的Windows系统上,也可以安装在虚拟机的Linux系统上,只要网络能与控制平面的公网地址互通即可.下面分别介绍 ...
- 通过modbus+socket+GPRS采集硬件数据
# !/usr/bin/python # -*- coding: UTF-8 -*- import sys import os TESTCASE = os.path.dirname(os.path.a ...
- 学Java的第5天，今天做了个双色球系统
今天是学JAVA的第5天,刚刚把方法学完,然后就在这做黑马的题. 用了一个多小时时间,把他的 这些题都做完了 但是最后一道题,这个双色球系统我感觉挺有意思的 我看到这个题,分析后感觉需要4种方法: 1 ...
- UEC++学习(2)
第三章 断言 第一节 简单的断言 断言让程序的进程中断,方便程序员发现在哪里发生了问题. AGameBase * GameBase = nullptr; check(false); check(Gam ...
- oracle导入dmp
通过impdp导入 1.sqlplus (连接oracle数据库) 2.输入用户名密码3.create user abc identified by 123456; (创建用户名为ab ...
- 12.1linux学习第十二 天
8.2 Iptables 在早期的Linux系统中,默认使用的是iptables防火墙管理服务来配置防火墙.尽管新型的firewalld防火墙管理服务已经被投入使用多年,但是大量的企业在生产环境中依然 ...
- SpringBoot系列---【maven项目引入第三方jar包并打包发布】
一.问题 项目中经常会碰到这样的问题,我们做的项目依赖别人打好的jar包,这种我们可以有两种途径解决,第一种是上传到私服,再从我们的项目去引入pom坐标,这种适合有私服账号或者自己会搭建私服的,成本有 ...
- Q:oracle锁表如何处理
解决ORA-00054资源正忙的问题 有时候在drop表或者其他对象的时候,会遇到ORA-00054:资源正忙,要求指定NOWAIT(中文字符集)或者ORA-00054: resource busy ...
- 在Win7的64位系统中安装最新版Eclipse或STS
Eclipse版本为:eclipse-jee-2021-12-R-win32-x86_64 STS版本为:sts-4.13.1.RELEASE 这两个版本中都自带了17.0.1的jre插件,默认会使用 ...
- WebPack之懒加载原理
代码结构 main.js console.log("这是main页面"); import(/* webpackChunkName: "foo" */" ...