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: 刷新   &nbsp 空格 &lt; &gt; 左尖括号 右尖括号

参考链接:http://www.imdsx.cn/index.php/2017/07/27/html2/

第13课:HTML基础之DOM操作2的更多相关文章

  1. 【2017-03-28】JS基础、DOM操作

    一.JS基础 1.javascript功能 ⑴进行数据运算 ⑵控制浏览器功能 ⑶控制元素的属性.样式.内容 2.javascript位置和格式 可以放在html页的任意位置,也可以创建一个以js结尾的 ...

  2. jquer 基础篇 dom操作

    DOM操作: 1.新增元素:创建元素:$("HTML")返回的创建成功的新元素新增子元素:元素.append(obj) 在匹配元素的里面新增一个子元素 追加方式 新元素作为最后一个 ...

  3. Jquery基础之DOM操作

    转自:http://www.cnblogs.com/bro-ma/p/3063942.html JQuery中的DOM操作主要对包括:建[新建].增[添加].删[删除].改[修改].查[查找][像数据 ...

  4. 第12课:HTML基础之DOM操作1

    DOM(Document Object Model):文本对象模型 dom对象实际上是html页面转成成的文本对象,可以通过dom对象中js提供的方法找到htm中的各个标签. 练习URL:http:/ ...

  5. JavaScript基础:DOM操作详解

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 JavaScript的组成 JavaScript基础分为三个部分: ...

  6. HTML基础二-DOM操作

    http://www.imdsx.cn/index.php/2017/07/27/html2/ DOM(Document Object Model 文档对象模型) 一个web页面的展示,是由html标 ...

  7. HTML基础之DOM操作

    DOM(Document Object Model 文档对象模型) 一个web页面的展示,是由html标签组合成的一个页面,dom对象实际就是将html标签转换成了一个文档对象.可以通过dom对象中j ...

  8. DOM基础及DOM操作HTML

     文件对象模型(Document Object Model.简称fr=aladdin" target="_blank">DOM).是W3C组织推荐的处理可扩展标 ...

  9. html基础:DOM操作

    DOM(Document Object Model 文档对象模型) 一个web页面被封装成一个dom对象,通过dom中的js对页面的标签进行操作 一.获取对象 浏览器页面上右键--检查--consol ...

随机推荐

  1. 从零开始写JavaWeb框架(第四章节的AOP)

    使用"链式代理"实现 AOP   本文是<轻量级 Java Web 框架架构设计>的系列博文. 大家是否还记得<Proxy 那点事儿>中提到的 CGLib ...

  2. django基于cors做跨域处理

    背景知识:跨域相关与cors策略 1.安装django-cors-headers pip install django-cors-headers 2.settings.py配置 INSTALLED_A ...

  3. Docker 随笔

    设置镜像时区 RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime RUN echo 'Asia/Shanghai' >/etc ...

  4. JS随机数种子

    JS随机数种子 1 试着想一下,如果在某一个场景,我们做一个游戏,用户玩到一半的时候退出了,这样 用户下次进来可以选择继续上一次的进度继续玩,那么现在问题来了:用户玩 的进度以及用户的积分等简单的描述 ...

  5. 文件下载—SSM框架文件下载

    1.准备上传下载的api组件 <dependency> <groupId>commons-io</groupId> <artifactId>common ...

  6. Underscore-逐行分析

    标签: // Underscore.js 1.8.3// http://underscorejs.org// (c) 2009-2015 Jeremy Ashkenas, DocumentCloud ...

  7. iview使用vue-i18n实现国际化

    iview官网中和网上的例子中使用的都是webpack方式,需要import js文件,但是由于项目架构比较简单,没有使用webpack,纯html和js进行交互.所以这里就直接使用js文件引用方式. ...

  8. kali_常用软件记录

    可参考:http://www.lvzejun.cn/2015/03/31/ubuntu-software/ 录屏软件 http://www.kohaupt-online.de/hp/ http://l ...

  9. [AHOI2008]上学路线

    题意:给定一个无向图,删除某些边有一定的代价,要求删掉使得最短路径减小,求最小代价. 首先要spfa求出起点到各个点的最短距离.对于一条权值为w,起点为i,终点为j的边,设dis[k]为起点到k点的距 ...

  10. Python学习札记(二十四) 函数式编程5 返回函数

    参考:返回函数 NOTE 1.高阶函数除了可以接受函数作为参数外,还可以把函数作为结果值返回. eg.求和函数 #!/usr/bin/env python3 def calsums(*args): a ...