第13课:HTML基础之DOM操作2
1.
1)d.innerHTML:标签中的所有内容

删除某个标签
a)可以直接修改innerHTML的值;
b)
2)d.innerText:标签中的文本内容

3)input.value='aaa' 修改页面中input框中的内容

直接定位到文本标签,获取它的value,给value赋值。

4)修改select选项值

5)一个div,同时引用2个class,这样写:<div class="tmp1 tmp2"></div>; 可以同时使用2个class的样式

另一种实现方式:使用c.classList.remove('***') /add('***')

css样式中属性可以用-连接,js中遇到所有的-都被去掉,-后面的第一个字母大写
**.style.***='' 给标签添加style属性

6)删除属性r.removeAttribute('value') ;
设置属性的值r.setAttribute('value', '通过set设置的属性')
获取标签的所有属性:r.attributes

7)创建标签对象,并设置它的属性
var inputObj = document.createElement('input')
inputObj.setAttribute('type', 'text')
inputObj.setAttribute('value', '创建标签')
inputObj.style.width = '80px'
inputObj.style.height = '80px'
inputObj.className = 'cla'
得到一个标签对象inputObj:
<input type="text" value="创建标签" style="width: 80px; height: 80px;" class="cla">
appendChild(tagObj):给父标签添加一个子标签。

字符串方式创建标签
inputStr:"<input type="text" value="创建标签" style="width: 80px; height: 80px;" class="cla">"
c.insertAdjacentHTML('beforeBegin', inputStr) # 插入到获取标签的前面
c.insertAdjacentHTML('afterEnd', inputStr1) # 插入到获取标签的后面
c.insertAdjacentHTML('afterBegin', inputStr1) # 插入到获取标签子标签的前面
c.insertAdjacentHTML('beforeEnd', inputStr1) # 插入到获取标签子标签的后面
8) 其它操作
console.log('****'): 打印数据
alert('***'): 弹框提示
confirm('***'): 确认弹框,返回true or false
location.href: 获取当前的url
location.href = 'http://www.imdsx.cn': 重定向
location.reload(): 刷新
location.href = location.href: 刷新
  空格 < > 左尖括号 右尖括号
参考链接:http://www.imdsx.cn/index.php/2017/07/27/html2/
第13课:HTML基础之DOM操作2的更多相关文章
- 【2017-03-28】JS基础、DOM操作
一.JS基础 1.javascript功能 ⑴进行数据运算 ⑵控制浏览器功能 ⑶控制元素的属性.样式.内容 2.javascript位置和格式 可以放在html页的任意位置,也可以创建一个以js结尾的 ...
- jquer 基础篇 dom操作
DOM操作: 1.新增元素:创建元素:$("HTML")返回的创建成功的新元素新增子元素:元素.append(obj) 在匹配元素的里面新增一个子元素 追加方式 新元素作为最后一个 ...
- Jquery基础之DOM操作
转自:http://www.cnblogs.com/bro-ma/p/3063942.html JQuery中的DOM操作主要对包括:建[新建].增[添加].删[删除].改[修改].查[查找][像数据 ...
- 第12课:HTML基础之DOM操作1
DOM(Document Object Model):文本对象模型 dom对象实际上是html页面转成成的文本对象,可以通过dom对象中js提供的方法找到htm中的各个标签. 练习URL:http:/ ...
- JavaScript基础:DOM操作详解
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 JavaScript的组成 JavaScript基础分为三个部分: ...
- HTML基础二-DOM操作
http://www.imdsx.cn/index.php/2017/07/27/html2/ DOM(Document Object Model 文档对象模型) 一个web页面的展示,是由html标 ...
- HTML基础之DOM操作
DOM(Document Object Model 文档对象模型) 一个web页面的展示,是由html标签组合成的一个页面,dom对象实际就是将html标签转换成了一个文档对象.可以通过dom对象中j ...
- DOM基础及DOM操作HTML
文件对象模型(Document Object Model.简称fr=aladdin" target="_blank">DOM).是W3C组织推荐的处理可扩展标 ...
- html基础:DOM操作
DOM(Document Object Model 文档对象模型) 一个web页面被封装成一个dom对象,通过dom中的js对页面的标签进行操作 一.获取对象 浏览器页面上右键--检查--consol ...
随机推荐
- go-005-变量、常量
概述 变量来源于数学,是计算机语言中能储存计算结果或能表示值抽象概念.变量可以通过变量名访问. Go 语言变量名由字母.数字.下划线组成,其中首个字母不能为数字. 声明变量的一般形式是使用 var 关 ...
- [Axiom3D]第一个Axiom3D程序
Axiom3D程序的基本渲染流程 #region Namespace Declarations using System; using System.Linq; using Axiom.Core; u ...
- 解决下载ftp文件过程中,浏览器直接解析文件(txt,png等)的问题
搭建了一个ftp服务器,供用户进行上传下载,在下载过程中发现,一些文件,例如txt,jpg,png,pdf等直接被浏览器解析了.在浏览器中显示其内容,没有下载. 下面通过网上查询得到一些解决方法: 最 ...
- oracle 死锁查询及处理
SELECT bs.username "Blocking User", bs.username "DB User", ws.userna ...
- bat笔记
背景介绍 现入职的公司包含发送EDM的项目,每天都有各种题型邮件需要发送,但是由于各种原因,发送EDM程序的服务器老是被网管各种重启 :) 作为负责人,对这事很恼火,隔几天就被投诉,怎么又没收到考勤邮 ...
- Java基础教程:网络编程
Java基础教程:网络编程 基础 Socket与ServerSocket Socket又称"套接字",网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个s ...
- VS2010/MFC编程入门之二十八(常用控件:列表视图控件List Control 上)
前面一节中,鸡啄米讲了图片控件Picture Control,本节为大家详解列表视图控件List Control的使用. 列表视图控件简介 列表视图控件List Control同样比较常见, ...
- 20155305乔磊2016-2017-2《Java程序设计》第九周学习总结
20155305 2016-2017-2 <Java程序设计>第九周学习总结 教材学习内容总结 JDBC入门 JDBC简介 1.JDBC是java联机数据库的标准规范,它定义了一组标准类与 ...
- SQL学习笔记之项目中常用的19条MySQL优化
在写文章之前,首先感谢 飞友科技 陆老师提供的文档.. 声明一下:下面的优化方案都是基于 “ Mysql-索引-BTree类型 ” 的 0x00 EXPLAIN 做MySQL优化,我们要善用 EXPL ...
- linux内核启动时报错ubi0 error: validate_ec_hdr: bad data offset 256, expected 128
1.错误解析 ubi的EC header中有一个字段data_offset来记录数据偏移,数据偏移必须正确才能正确读取每一个物理擦除块中的数据 2.解决方法 擦除整块flash,然后再重新烧写包含ub ...