BOM+DOM+JavaScript读取与操作网页对象

DOM

网页的元素有多种定义方式,那我们怎么描述或指定页面上某个元素呢。为了统一方式,产生了document object model 标准
以HTML表单为例,
文本字段前面的标题由label标签声明
每个表单字段都通过id属性设置唯一的识别名称,用于让程序选取元素。
通常数据名称name和识别名称id取相同名字

BOM和DOM

BOM:整个浏览器窗口构成的结构
BOM没有标准规范

windowdocument location(网址)history(浏览历史)navigator(浏览器信息)

DOM:网页文档元素构成的树状结构
W3C有标准

document(文档对象)
<html>
<body>
<form>(<-标签元素(对象))<label>"num1"(<-字段id名称)字段<label>"num2"字段<br><p>"calc"按钮

可进行的处理:
1.获取页面标签的数据
2.修改标签数据包括文本和属性
3.在页面中添加标签
4.设置事件处理程序

读取与操作网页对象

在这里插入图片描述
首先写一个html文件(你也可以用记事本写,然后改格式为.html),用浏览器打开,然后ctrl+shift+j调出来JavaScript控制台,我们通过输入下面两行代码对它的对象进行输入操作

在这里插入图片描述

我们通过JavaScript在第一个框里面添入了12

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/560615.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

datax 导入数据中文乱码_DataX在有赞大数据平台的实践

文| 小木 on 大数据一、需求有赞大数据技术应用的早期&#xff0c;我们使用 Sqoop 作为数据同步工具&#xff0c;满足了 MySQL 与 Hive 之间数据同步的日常开发需求。随着公司业务发展&#xff0c;数据同步的场景越来越多&#xff0c;主要是 MySQL、Hive 与文本文件之间的数据同…

网页中嵌入JavaScript+事件触发程序

嵌入方式&#xff1a; 1.JavaScript代码与HTML写在同一个文档中 JavaScript代码要放在<script>和</script>标签之间 而且整个JavaScript代码最好放在</body>前&#xff0c;这样可以让浏览器先加载并显示主体 2.JavaScript代码单独存成.js文件&#xff0c;…

sql相同顺序法和一次封锁法_数学专题 | Ep01 隔板法的妙用

数学专题(一) 隔板法的妙用浓度常见哪些问题?排列组合分堆&#xff1f;涂色&#xff1f;到底掌握透彻了吗&#xff1f;解析几何与韦达定理&#xff1f;公式总是记不住&#xff1f;应用题还不会解&#xff1f;除了写作(写作听我的)、逻辑(逻辑说)专题外&#xff0c;本周起我们也…

通过CDN引用jQuery库+jQuery的使用+网页实现计算器的功能

jQuery是什么&#xff1f;有什么用&#xff1f; jQuery是javascript库&#xff0c;其实就是一堆的js函数&#xff0c;方便我们来调用&#xff0c;提高我们的开发效率 免费开源&#xff0c;支持主流浏览器&#xff0c;简化选取网页元素的语法&#xff0c;简易的读取设置元素的…

linux dev alloc name,深入理解Linux网络技术内幕-设备注册和初始化(二)

NIC注册和注销的通用架构Linux系统中NIC网络设备驱动程序利用网络代码进行注册和注销有其通用的架构&#xff0c;这里以PCI Ethernet NIC为例&#xff0c;其他设备类型只是所以函数名称和调用方式不同&#xff0c;主要依据于设备总线提供的接口。其中(a)为设备注册的大致流程图…

外贸常用术语_外贸中常用的会计术语及付款方式术语 | 会计英语

点击上面“财经英语”关注公众号&#xff01;点击下面小程序加入: 学习圈财经英语 学习圈 预付现金 Cash advance 凭提货单支付现金 Cash against Bill of Lading (B/L) 凭单据付现款||凭装货单付现款 Cash against Documents 现金结存||现金差额 Cash balance 现收现付制||现金…

python 多维list 排序_一行代码的优雅| Python列表生成式

欢迎回来&#xff0c;上一周我们整理了基础课中三大结构有关内容的具体应用及案例。可以通过以下几篇推文进行回溯&#xff1a;Python语言基础50课我的Python - 100天笔记 |D1-D7我的Python - 100天笔记 |D8-D14列表是Python中非常常见的数据结构&#xff0c;在基础课中也占了不…

verilog 生成块_如何高效的编写Verilog——终极版

为了高效的编写Verilog&#xff0c;通常有些编辑器插件可以自动生成代码&#xff0c;比如自动端口定义&#xff0c;自动连线&#xff0c;自动实例化等等。公司的环境有很好用的自动化插件&#xff0c;想给自己的电脑也整个怎么做。比如Emacs中有个插件叫verilog-mode。但是博主…

剩余 大小 查看内存_JVM的内存分配策略以及进入分代的条件

JVM的参数和知识点太多啦&#xff0c;记录下来&#xff0c;供自己随时回顾。java对象什么时候进入年轻代&#xff08;新生代&#xff09;&#xff1f;java对象什么时候进入老年代&#xff1f;对象优先在Eden分配大对象直接进入老年代空间分配担保机制java对象什么时候进入年轻代…

Arduino的串口结束符及串口缓冲区

文章目录1.深入理解缓冲区和Serial.available()&#xff1a;2.深入理解串口结束符3.验证结论&#xff1a;1.深入理解缓冲区和Serial.available()&#xff1a; 运行下面的代码&#xff0c;我发现如果不在串口输入任何数字&#xff0c;就会一直显示“no”&#xff0c;输入一个数…

android 圆角边框边框渐变,支持边框、圆角、渐变色、透明度的GradientButton

最近在项目中发现好多Button背景颜色相同&#xff0c;但圆角大小不等的Button&#xff0c;这样就得写一大堆的shape或者selector&#xff0c;不便于管理及后期维护&#xff0c;于是乎变想能不能写一个支持边框、圆角、渐变色、透明度的万用Button呢。为了能够兼容button自带的属…

鸿蒙ide如何运行,深入浅析华为鸿蒙IDE安装与Hello World

一、系统安装1. 到官网下载HUAWEI DevEco Studio2. 安装二、创建项目创建项目目前还没有手机选项&#xff0c;所以我先选择一个电视&#xff1a;IDE的环境看起来和idea差不多&#xff0c;应该比较容易上手。从“关于”里也可以看到&#xff0c;确实是基于IDEA开源版本开发的。我…

中快捷搜索_同事用1分钟,我用半小时,原来是因为这8个Word快捷键,秒杀一切办公技巧...

同事用1分钟&#xff0c;我用半小时&#xff0c;这8个Word快捷键&#xff0c;秒杀一切办公技巧​mp.weixin.qq.com文&#xff5c;王羽卒今天给小伙伴们分享几个实用又有效的快捷键&#xff0c;帮助快速完成工作&#xff0c;同事用了半小时&#xff0c;你1分钟就能解决哟&#x…

荣耀x10max能不能升级为鸿蒙,荣耀终于放出大招!4部荣耀旗舰可升级鸿蒙,网友:终于等到了...

4月24~26日&#xff0c;华为将召开开发者大会&#xff0c;届时手机使用的鸿蒙系统将正式上线&#xff0c;华为和部分荣耀手机将会首先支持。其实&#xff0c;早在2月22日的华为Mate X2的发布会上&#xff0c;余承东就说过4月发布鸿蒙OS。华为并不想推出鸿蒙系统&#xff0c;如果…

android 7.0新增控件,自定义Android控件,封装Arcgis for Android测距测面积工具控件

控件的功能包括&#xff0c;测距、测面积、撤销、恢复、清除、完成六个功能。测距&#xff1a;在地图上绘制线段进行长度测量测面积&#xff1a;在地图上绘制一个面&#xff0c;进行面积测量撤销&#xff1a;撤销到上一步绘制&#xff0c;只能撤销未完成的测量恢复&#xff1a;…

多媒体分析与理解_如何设计一个出色的数字多媒体展厅?

展厅设计方案是了解每个多媒体设备的应用方法&#xff0c;那么如何让设备跟展厅结合一起&#xff0c;展示出我们想要的科技效果&#xff0c;核心就是用户体验度。今天华南数字科技的小编就为您介绍下数字多媒体展厅对用户体验方面的几个重点要素。1、细节展示不论多前卫的多媒体…

gradient设置上下渐变_图解CSS: CSS渐变

CSS的渐变主要分布在 conic-gradient()和repeating-conic-gradient()两个属性。在CSS中&#xff0c;CSS的渐变相当于图像&#xff0c;我们可以使用线性渐变(linear-gradient()和repeating-linear-gradient())、径向渐变(radial-gradient()和repeating-radial-gradient())和锥形…

2021泗阳致远中学高考成绩查询,2021高考成绩什么时候发布?可通过哪些途径查询?...

3、安徽省高考成绩预计将于6月23日公布各批次录取分数线和高考成绩&#xff0c;考生可通过安徽省教育招生考试院自行查分&#xff1b;4、湖南高考成绩将于6月25日左右公布&#xff0c;本科不再分一二三批&#xff0c;考生可通过湖南教育政务网、湖南省普通高校招生考试考生综合…

mysql数据库的字符集_mysql数据库中字符集乱码问题原因及解决

前言有的时候我们在查看数据库数据时&#xff0c;会看到乱码。实际上&#xff0c;无论何种数据库只要出现乱码问题&#xff0c;这大多是由于数据库字符集设定的问题。下面我们就介绍一下&#xff0c;数据库的字符集的设定及乱码问题的解决。mysql数据库的字符集直白的说&#x…

1主5从mysql数据库_MySQL主从复制虽好,能完美解决数据库单点问题吗?

一、单个数据库服务器的缺点数据库服务器存在单点问题&#xff1b;数据库服务器资源无法满足增长的读写请求&#xff1b;高峰时数据库连接数经常超过上限。二、如何解决单点问题增加额外的数据库服务器&#xff0c;组建数据库集群&#xff1b;同一集群中的数据库服务器需要具有…