前端 Dom 直接选择器
文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口。它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式。我们最为关心的是,DOM把网页和脚本以及其他的编程语言联系了起来。DOM属于浏览器,而不是JavaScript语言规范里的规定的核心内容
JS有两个内容
一个找到标签
操作标签
Dom
让页面动起来条件
1、找到标签
整个html id 不能重复
获取单个元素 document.getElementById('i1')
获取多个元素(列表)document.getElementsByTagName('div') 以列表形式显示
获取多个元素(列表)document.getElementsByClassName('c1') CSS 以列表形式显示
a. 直接找
document.getElementById 根据ID获取一个标签
document.getElementsByName 根据name属性获取标签集合
document.getElementsByClassName 根据class属性获取标签集合
document.getElementsByTagName 根据标签名获取标签集合
2、操作标签
a. innerText
获取标签中的文本内容
标签.innerText
对标签内部文本进行重新赋值
标签.innerText = ""
document.getElementById('il');
<div id="il">我是il</div>
获取文本内容
document.getElementById('il').innerText;
"我是il"
重新赋值
document.getElementById('il').innerText = "新内容";
"新内容"
拿到三个标签 是个列表
document.getElementsByTagName('a');
[<a>aaaa</a>, <a>909</a>, <a>kadfdasd</a>]
取值
document.getElementsByTagName('a')[1]
<a>909</a>
把909 改成666
document.getElementsByTagName('a')[1].innerText = '666';
"666"

把列表循环 把里面元素都替换成666字符串
var tag = document.getElementsByTagName('a');
for(var i=0;i<tag.length;i++){
tag[i].innerText = '666';
}
"666"
前端 Dom 直接选择器的更多相关文章
- JavaScript实现DOM对象选择器
目的: 根据传入的选择器类型选出第一个符合的DOM对象. ①可以通过id获取DOM对象,例如 $("#adom"); ②可以通过tagName获取DOM对象,例如 $(" ...
- DOM的选择器
这几天学习了DOM的选择器,现在来进行一下总结分类. 1.DOM里的元素节点选择器 元素节点选择器包括id,class,name,tagname,高级,关系. 1.1 id选择器 id:返回的是单个对 ...
- Dom直接选择器
Dom直接选择器 <!DOCTYPE html> <!--Dom间接选择器--> <html lang="en"> <head> & ...
- Python之Web前端Dom, jQuery
Python之Web前端: Dom jQuery ###Dom 一. 什么是Dom? 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它 ...
- DOM querySelector选择器
原生的强大DOM选择器querySelector 在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并 ...
- DOM 的选择器 API
在刚开始的时候,我们只能用 getElementById,getElementsByClassName,getElementsByTagName 这几个 DOM 方法查找 DOM 树中的元素.后来,在 ...
- 前端--关于css选择器
css选择器就好像表达式一样,返回一组或者一个html元素,后面的样式声明块应用到返回的元素上.所以可以把css选择器理解为某个或者某一类html元素的抽象的写法. 在讲具体的各种选择器之前要提一下选 ...
- 前端备忘录--JQuery选择器
基本选择器 基本选择器是最常用的选择器,也是最简单的选择器. $("#test") //选取id为test的元素 $(".test") //选取class为te ...
- 前端——DOM
什么是DOM? DOM是W3C(万维网联盟)的标准,是Document Object Model(文档对象模型)的缩写,它定义了访问HTML和XML文档的标准: “W3C文档对象模型(DOM)是中立于 ...
随机推荐
- Qt之QThreadPool和QRunnable
简述 QRunnable 是所有 runnable 对象的基类,而 QThreadPool 类用于管理 QThreads 集合. QRunnable 类是一个接口,用于表示一个任务或要执行的代码,需要 ...
- 在.net4的环境下使用Microsoft.AspNet.SignalR.Client 2.4.0
我的环境是运行在.net 4 framework,并且使用了signalr 在重连的时候发现,运行的服务被关闭了.找不到合适的处理的办法.因为报错是 说明: 由于未经处理的异常,进程终止.异常信息: ...
- 用SVN checkout源码时,设置账号
如果直接在“svn co”后加url的话,svn老是要我登录操作系统用户名对应的密码. Ubuntu系统 ================== 用“svn co --help”命令看到如下的选项 Gl ...
- javascript父、子页面交互小结
帧用来存放子页面,既可以是iframe,又可以是frameset.window对象是全局对象,页面上的一切函数和对象都在它的作用域里. 1.parent代表父窗口.如果父窗口又存在若干层嵌套, ...
- GAN 生成mnist数据
参考资料 GAN原理学习笔记 生成式对抗网络GAN汇总 GAN的理解与TensorFlow的实现 TensorFlow小试牛刀(2):GAN生成手写数字 参考代码之一 #coding=utf-8 #h ...
- 第二百四十七节,Bootstrap按钮和折叠插件
Bootstrap按钮和折叠插件 学习要点: 1.按钮 2.折叠 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件. 一.按钮 可以通过按钮插件创建不同状态的按钮,也就是点击后为选中状态 ...
- 【wikioi】3160 最长公共子串(后缀自动机)
http://codevs.cn/problem/3160/ sam的裸题...(之前写了spoj上另一题sam的题目,但是spoj被卡评测现在还没评测完QAQ打算写那题题解时再来详细介绍sam的.. ...
- 把本地仓库导入到Github
1, create a new rep 2, 进入到本地仓库: $ git remote set-url origin URL 3,上传 git push -v ref: https://www.do ...
- ES5与ES6的继承
JavaScript本身是一种神马语言: 提到继承,我们常常会联想到C#.java等面向对象的高级语言(当然还有C++),因为存在类的概念使得这些语言在实际的使用中抽象成为一个对象,即面向对象.Jav ...
- MathType与Office公式编辑器有什么不同
说到在论文中编辑公式,有经验的人都会知道要用公式编辑器来编辑,没经验的人也会被安利使用公式编辑器.然而在使用公式编辑器时,又有了两种选择,一种是使用Office自带的公式编辑器,一种是MathType ...
拿到三个标签 是个列表