码迷,mamicode.com
首页 > Web开发 > 详细

html DOM操作

时间:2019-12-06 00:32:12      阅读:294      评论:0      收藏:0      [点我收藏+]

标签:htm   网页   F12   classname   跳转   文档对象模型   标签   ons   www   

DOM(document object model  文档对象模型)  通过dom获取的元素就一定能修改

一个web页面的展示,是有html标签组合的一个页面,dom对象实际就是将html标签转换成了一个文档对象。可以通过dom对象中js提供的方法,找到html的各个标签。通过找到标签就可以操作标签使页面动起来,让页面动起来。

目的:
操作页面上的任意的一个标签

在网页中 按F12 .找到console 。在里面输入document,然后回车。document下就代表整个页面。

document.getElementById(‘inner1‘)  通过id精准定位

document.getElementsByClassName("inner")通过class进行定位,不是唯一,可定位多个

在js中定义一个变量用var 去定义一个变量

var el =document.getElementById(‘inner1‘)  

el.innerText el.innerHtml

1.innerText、innerHtml: 只是打印标签内的文本信息,HTML代码会被省略。innerHtml则全部打印。修改时,通过innnerText只会变为一个字符串,通过innerHtml则可以变为一个标签

el.innerText=‘<a href="http://www.baidu.com">跳转到百度</a>‘    传什么进去都是文本展示出来。

el.innerHTML=‘<a href="http://www.baidu.com">跳转到百度</a>‘  innerHtm会自动去解析符合html标签规则的。

html DOM操作

标签:htm   网页   F12   classname   跳转   文档对象模型   标签   ons   www   

原文地址:https://www.cnblogs.com/11-pythong/p/11992650.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!