位置: 编程技术 - 正文

JavaScript驾驭网页-DOM

编辑:rootadmin

推荐整理分享JavaScript驾驭网页-DOM,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

一、DOM全称

文档对象模型(Document Object Model)

二、DOM是什么

DOM就是一个编程接口,就是一套API。DOM是针对HTML文档、XML等文档的一套API。就类似于JDBC是针对数据库的一套API一样。

三、DOM的用途

DOM 是用来访问或操作HTML文档、XHTML文档、XML文档中的节点元素。

现在基本上所有的浏览器都都执行了W3C发布的DOM规范,所以在浏览器上就可以用DOM的这些API。

DOM提供对脚本友善的网页结构与内容的视图

DOM把网页视为节点构成的层次树

DOM树

每棵DOM树的最顶端节点都是Document,它在HTML节点的上层

网页是DOM节点的集合

见图1

节点类型

网页节点是按类别分类的,主要有元素节点与文本节点构成

见图2

节点特性

利用节点特性能用于导览节点树

JavaScript驾驭网页-DOM

以下是常用的节点特性:

nodeValue 存储于节点的值,只限于文本与属性节点使用(不含元素)

nodeType 节点类型,例如它是DOCUMENT或TEXT等等,但以代号表示

childNodes 包含节点下所有子节点的数组,以出现在HTML代码中的顺序而排列

firstChild 节点下的第一个子节点

lastChild 节点下的最后一个子节点

例子

利用DOM改变元素的内容

首先 移除所有子节点

然后 根据新内容创建新的文本节点

最后 把新创建的文本子节点附加到节点下

这里涉及到三个方法

removeChidl()移除目标节点下的一个子节点,传入将被移除的子节点

createTextNode()从文本字符串创建文本节点

appendChildO()以最后一个子节点的开工加入新节点,传入将被新增加的子节点

总结

innerHTML虽并非万维网的标准,但这个特性能访问元素内存储的所有内容

Document Object Model(文档对象模型),简称DOM,提供访问和修改网页数据的标准化机制

DOM视图页为关联节点的层次树

使用DOM(而非innerHTML)改变网页内容的方案,需移除元素下所有的子节点,然后创建并附加上包含新内容的新子节点。

关于JavaScript驾驭网页-DOM就给大家介绍到这里,下篇将给大家介绍JavaScript驾驭网页-CSS与DOM,感兴趣的朋友点击查看详情!

JavaScript驾驭网页-CSS与DOM 推荐阅读:JavaScript驾驭网页-DOMDOM是种符合万维网标准的HTML操纵方式,它能比innerHTML特性达成更多操控功能这里有HTML代码与CSS代码!doctypehtmlhtmlheadmetach

JavaScript驾驭网页-获取网页元素 推荐阅读:JavaScript驾驭网页-DOMJavaScript驾驭网页-CSS与DOM利用DOM分割HTML利用JavaScript控制网页内容其实很像烹饪。只是不用收拾列羹剩肴,但也没有办法

js+css实现select的美化效果 先给大家看一看美化之后的效果图:CSS:.div-select{border:solid1px#;height:px;line-height:px;cursor:default;}.div-select-text{float:left;background-color:#fff;height:%;word-br

标签: JavaScript驾驭网页-DOM

本文链接地址:https://www.jiuchutong.com/biancheng/375945.html 转载请保留说明!

上一篇:JS中setTimeout的巧妙用法前端函数节流

下一篇:JavaScript驾驭网页-CSS与DOM

  • 金税四期怎么监控银行流水
  • 企业前期开办费怎么入账
  • 发行股票的手续费计入什么费用
  • 合营企业和联营企业的持股比例
  • 汇款退回来的可以不做账吗
  • 财务如何审核合同支付条款风险
  • 现金流量补充表的编制
  • 小规模变更为一般纳税人流程
  • 跟个人租车可以到税务局开发票吗
  • 员工上下班交通安全培训
  • 纳税人如何申请享受税收减免优惠
  • 销售研发试制样板图
  • 库存冲红是什么意思
  • 广告公司对外捐赠的会计处理怎么做?
  • 个体工商户所得税税率表
  • 企业筹建期间需要招几个会计
  • 当年缴纳的税金怎么入账
  • 纳税人为ETC卡充值取得财政票据进项税额抵扣问题
  • 新公司注册后先开户还是先税务登记
  • 直接成本和间接成本差异
  • 公司注销有哪些原因
  • 汇总纳税企业的分公司如何享受税收优惠政策
  • 无车承运人增值税
  • 制造企业材料返回流程图
  • 发票冲红有时间要求吗
  • 产品种类很多月末怎么结转生产成本
  • 内外账合并步骤
  • 上年销项税额录错了,怎么调整
  • 内帐应收应付款坏账年末怎么处理?
  • 工伤保险的作用有
  • 公司股权分红款需要税吗
  • php中实现文件的上传需要使用哪个全局变量
  • win11如何调整鼠标中键
  • 应收账款可不可以作为质押合同的标的
  • PHP:pg_set_client_encoding()的用法_PostgreSQL函数
  • linux网络接口状态命令
  • php最好的编程语言
  • 企业所得税申报流程
  • 银行询证函费用减免
  • php格式的图片
  • Vue Router4 ,prams 传参失效和报错问题
  • 3d人体骨骼模型软件
  • 发票明细怎么导出数量
  • python字符串如何换行
  • dedecms配置
  • python元数据
  • 企业报废车辆如何做账
  • 年度利润表与12月利润表区别
  • 采购材料单表格
  • 城市维护建设税属于中央还是地方
  • 一般纳税人销售旧货
  • 非税收入票据能报税吗
  • 什么是稳岗补贴呢
  • 向投资者支付的股息
  • 个体工商户怎样申报个税流程
  • 机动车发票红冲后重新开具
  • 现金收货款要填什么信息
  • 个人与公司交易需要纳税吗
  • 支付到期承兑汇票属于什么现金流量项目
  • 事业单位职工福利费计提标准和使用
  • 购买理财收入计入什么科目
  • 赠送成本的会计分录
  • 研发费用怎样进成本科目
  • mysql加密解密
  • mysql从5.7升级至8.0
  • 计算机上没有运行windows无线服务
  • win7系统的启动项在哪里
  • kdeskcore.exe是什么
  • win7旗舰版系统重装
  • 32/64位Win10预览版11102(中英日韩等)多国语言包官方iso镜像下载大全
  • Win7系统关闭自动更新
  • 使用的英文
  • json 日期类型
  • 黑马程序员培训怎样
  • js使用类
  • jquery插件开发方法
  • 广东省电子职业技术学院
  • 安徽省渔业管理办法第十条规定
  • 股权转让税务备案时间
  • 未开票收入下月开票会计分录
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设