位置: 编程技术 - 正文

JS中使用DOM来控制HTML元素(js操作dom节点的方法)

编辑:rootadmin

推荐整理分享JS中使用DOM来控制HTML元素(js操作dom节点的方法),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js中的dom,js dom操作方法,js dom bom,js操作dom节点的方法,js中dom操作,javascript中dom的含义,js domcontentloaded,js中dom操作,内容如对您有帮助,希望把文章链接给更多的朋友!

1.getElementsByName():获取name.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~`

例:

结果:界面打印出三个hello,并且伴有一个提示框“3”,当点击确定后,界面显示的内容变为hello hello world

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~··

2.getElementsByTagName():获取元素。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

结果:界面打印出三个hello,并且伴有一个提示框“3”,当点击确定后,界面显示的内容变为hello hello world

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

3.getAttribute():获取元素属性。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

结果:弹出提示框“a的ID是:aid”.点击确定后,弹出提示框“a的title内容是:得到a的标签属性”。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~4.setAttribute()设置元素属性。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

结果:弹出提示框“动态设置的title值为:动态设置a的title属性”。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~

5.childNodes():访问子节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~··

结果:界面打印出.1 .2 .3弹出对话框“3”,按确定后弹出“1”。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

6.parentNode():访问父节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~·

结果:弹出提示框:DIV.

JS中使用DOM来控制HTML元素(js操作dom节点的方法)

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

7.createElement():创建元素节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例:

结果:出现一个按钮。

~~~~~~~~~~~~~~~~~~~~~~~~~~~

8.createTextNode():创建文本节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例:

代码分析:这个例子创建了一个新<div>元素并为它指定了值为“message”的class特性。然后,又创建了一个文本节点,并将其添加到前面创建的元素中。最后一步,就是将这个元素添加到了文档中的<body>元素中,这样可以在浏览器中看到新创建的元素和文本节点了。

结果:页面显示hello world。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

9.insertBefore():插入节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

结果:界面打印出:动态插入一个p元素

p元素

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

.removeChild():删除节点。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~·

结果:界面什么也没显示。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

.offsetHeight:网页尺寸

.scrollHeight:网页尺寸

~~~~~~~~~~~~~~~~~~~~~~~~~~~·

例:

显示结果:

这篇文章主要介绍了JS DOM 来控制HTML元素,文章内容主要包括关于DOM,HTML等,文章来自网络,请参考。

详细谈谈javascript的对象 javascript中有很多对象内容,挑几个感觉用的比较多的讲解。在网上学习一些和看javascript的学习手册。如果要这个手册的可以留言,看到了我就发给你。

javascript 数组的正态分布排序的问题 最近几天顶着上海°的凉爽天气找工作,心里是开心的不要不要的,每次面试都是要坐那里出半天汗才能回过神来,感觉到了这个世界对我深深的爱意

JavaScript的字符串方法汇总 1.stringObject.charAt()作用:返回字符串的下标varstr="这是一串字符串";console.log(str.charAt(0))//这2.stringObject.charCodeAt()作用:方法可返回指定位置的字符的Unicode

标签: js操作dom节点的方法

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

上一篇:图解prototype、proto和constructor的三角关系(纸嫁衣6攻略全文图解)

下一篇:详细谈谈javascript的对象(详细谈谈哲学的基本问题)

  • 融资租赁的两种模式
  • 为员工代缴社保材料
  • 外购无形资产的摊销额计入什么费用
  • 2019发票认证期限新规
  • 其他应付款长期挂账违反什么规定
  • 应收账款项目分析思维导图
  • 托管物资账务处理流程
  • 单位缴纳的社保在哪里查询
  • 会计凭证填制错误怎么办
  • 分批收款收据怎么写
  • 高新企业职工教育经费扣除比例
  • 自用房产税如何计算
  • 其他应收款余额在贷方,怎么填资产负债表
  • 印花税缴纳后合计怎么算
  • 社保滞纳金税前怎么算
  • 纳税人必须熟知什么
  • 学生兼职需要交什么税
  • 个人名义去税务局开票
  • 购入资产当月开始计提折旧
  • 预付账款怎么做账
  • 增值税一般纳税人认定标准
  • 企业发生的哪些业务可以使用简易计税法
  • 跨期费用会计处理
  • macbookair网页全屏
  • 电脑不支持windows 11
  • 如何关闭windowsdefender防病毒
  • msiexec.exe是什么进程介绍
  • win10系统如何禁用驱动强制签名
  • windows 10 21h1
  • 房地产公司股权收购
  • linux阅读pdf
  • 手机怎么设置无信号
  • 莱奇沃思田园城市
  • 2020年外贸企业年终总结
  • 会计编录怎么做
  • php设计原则
  • 米尔福德试车场
  • cookies方法
  • phpinfo()中Loaded Configuration File(none)的解决方法
  • 社保基数和实际工资怎么算
  • 劳务费发票差额征税
  • js解构赋值浏览器报错
  • smitty命令用法
  • 直接进入税金及附加的科目
  • 工会捐款怎么账务处理
  • 电梯安装行业分类
  • 个税少报了能查出来吗
  • 限定性净资产是指什么
  • php判断useragent
  • mysql将查询结果存到另一个表
  • 3步搞定纯真ip数量
  • 采购货物没有发票开出去有发票有什么风险
  • mysql集群配置
  • 跨月冲红的发票怎么做会计分录
  • 没有发票会怎样
  • 什么是流动负债确认条件是什么
  • 基本账户可以转私人账户吗
  • 合并报表怎么合并
  • 关于端午节福利发放的通知(通知公告)
  • 何为调整事项
  • 创办小企业如何起步
  • sql server如何查询
  • linux系统监控软件
  • winpup32.exe - winpup32是什么进程 什么意思
  • linux系统中scp命令的使用介绍
  • win7怎么调窗口大小
  • pavprot.exe - pavprot是什么进程 作用是什么
  • unity自动攻击
  • cocos2dx quick lua 学习笔记1
  • unity game optimization
  • opengl gltranslatef
  • ie在支持ftp的功能方面
  • for循环取数据
  • Node.js中 __dirname 的使用介绍
  • unity破解安装教程
  • 税务局风险防控形成长远
  • 印度有加入世贸吗
  • 限售股转让如何交税
  • 税务公文字体
  • 税务核查系统
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设