JavaScript

　　[1]事件

　　　　①用户操作网页或者浏览器所发生的交互行为称为事件。比如：点击按钮，最小化窗口，修改文本框内容等。

　　　　②JS为我们定义许多浏览器中的事件。比如：单击(onclick)、双击(ondblclick)、移动(onmousemove) 等。

　　　　③我们可以通过为事件设置一个响应函数来对事件进行响应：

 <body>

 <button id="btn">按钮</button>

 </body>

 <script type="text/javascript">

     //获取到按钮的对象

     var btn = document.getElementById("btn");

     //为btn绑定一个单击响应函数

     btn.onclick = function(){

     alert("hello World!");

     };

 </script>

　　[2]加载方式

　　　　①浏览器加载网页代码时是由上到下依次加载的。

　　　　②如果我们在浏览器还尚未加载网页中的元素，那么将无法确定，控制台将会报错，解决该问题有两种方式：

　　　　　　1) 将JS代码编写到body标签的下边。但是我们习惯上将JS、CSS等代码都写在head标签中。这种形式不符合使用习惯。

　　　　　　2) 将js代码编写到window.onload = function(){}中。推荐的使用方式。（ps:在编写js代码的时候最好开始的时候就将window.onload = function(){}写上）。

　　[3]DOM编程

　　　　DOM全称：Document Object Model。

　　　　DOM主要是通过JavaScript来控制网页中的各种元素，从而达到使网页可以和用户进行动态交互的作用。

　　　　DOM的操作主要分四部分增、删、改、查。　　　

　　　　节点类型：
　　　　　　- 元素节点
　　　　　　- 文本节点
　　　　　　- 属性节点

　　　　①DOM查询

　　　　　　1) 通过document对象查询：

　　　　　　　　document.getElementById(id);  ---> 通过id获取一个元素节点对象.　　　

　　　　　　　　document.getElementsByTagName(标签名); ---> 通过标签名获取一组元素节点对象.

　　　　　　　　document.getElementsByName(name属性); --->通过name属性获取一组元素节点对象，一般用来获取表单项.　

　　　　　　2) 通过具体的元素对象查询:

　　　　　　　　element.getElementsByTagName(标签名); --->查找当前元素节点内指定标签名的子节点

　　　　　　　　element.childNodes; --->获取当前节点的所有子节点.

　　　　　　　　element.parentNode; --->获取当前节点的父节点.

　　　　　　3) 获取元素的属性:

　　　　　　　　获取  :  元素.属性名

　　　　　　　　设置  ： 元素.属性名 = 属性值;

　　　　　　4)this:

　　　　　　　　this指向的是当前函数的所属对象。

　　　　DOM的增删改：　　　

　　　　　　1) 创建元素节点：document.createElement(标签名);

　　　　　　2) 创建文本节点: document.createTextNode(文本值);

　　　　　　3) 添加子节点: 父节点.appendChild(子节点);

　　　　　　4) 插入节点: 父节点.insertBefore(新节点,旧节点);

　　　　　　5) 替换节点: 父节点.replaceChild(新节点,旧节点);

　　　　　　6) 删除节点: 父节点.removeChild(子节点); / 子节点.parentNode.removeChild(子节点) *****

　　　　　　7) 读写元素内部HTML代码

　　　　　　　　读取: 元素.innerHTML

　　　　　　　　设置: 元素.innerHTML = 新值
　　　　　　　　

　　　　

　　　　

后端Java工程师常用JavaScript_DOM的更多相关文章

  1. Java工程师常用Linux命令

    本文所列的Linux常用命令包含:文件相关(目录操作,内容查看,查找与比较,压缩与解压),进程管理,网络操作,系统管理,性能监测与优化,Java常用工具多个方面概述. 文件目录基本操作 ls 命令用来 ...

  2. 我最推荐的一张Java后端学习路线图，Java工程师必备

    前言 学习路线图往往是学习一样技术的入门指南.网上搜到的Java学习路线图也是一抓一大把. 今天我只选一张图,仅此一图,足以包罗Java后端技术的知识点.所谓不求最好,但求最全,学习Java后端的同学 ...

  3. 《菜鸟程序员成长之路：从技术小白到阿里巴巴Java工程师》

    <菜鸟程序员成长之路:从技术小白到阿里巴巴Java工程师> 国庆节快乐!一年一度长度排第二的假期终于来了. 难得有十一长假,作者也想要休息几天啦. 不管你是选择出门玩,还是在公司加班,在学 ...

  4. 原创电子书《菜鸟程序员成长之路：从技术小白到阿里巴巴Java工程师》

    <菜鸟程序员成长之路:从技术小白到阿里巴巴Java工程师> 国庆节快乐!一年一度长度排第二的假期终于来了. 难得有十一长假,作者也想要休息几天啦. 不管你是选择出门玩,还是在公司加班,在学 ...

  5. Java工程师学习指南（入门篇）

    Java工程师学习指南 入门篇 最近有很多小伙伴来问我,Java小白如何入门,如何安排学习路线,每一步应该怎么走比较好.原本我以为之前的几篇文章已经可以解决大家的问题了,其实不然,因为我之前写的文章都 ...

  6. Java工程师学习指南（初级篇）

    Java工程师学习指南 初级篇 最近有很多小伙伴来问我,Java小白如何入门,如何安排学习路线,每一步应该怎么走比较好.原本我以为之前的几篇文章已经可以解决大家的问题了,其实不然,因为我之前写的文章都 ...

  7. Java工程师学习指南（中级篇）

    Java工程师学习指南 中级篇 最近有很多小伙伴来问我,Java小白如何入门,如何安排学习路线,每一步应该怎么走比较好.原本我以为之前的几篇文章已经可以解决大家的问题了,其实不然,因为我写的文章都是站 ...

  8. Java工程师学习指南（完结篇）

    Java工程师学习指南 完结篇 先声明一点,文章里面不会详细到每一步怎么操作,只会提供大致的思路和方向,给大家以启发,如果真的要一步一步指导操作的话,那至少需要一本书的厚度啦. 因为笔者还只是一名在校 ...

  9. Java后端开发工程师是否该转大数据开发？

    撰写我对java后端开发工程师选择方向的想法,写给在java后端选择转方向的人 背景 看到一些java开发工程师,对java后端薪酬太悲观了.认为换去大数据领域就会高工资.觉得java后端没有前途.我 ...

随机推荐

  1. Mysql - 查询之关联查询

    查询这块是重中之重, 关系到系统反应时间. 项目做到后期, 都是要做性能测试和性能优化的, 优化的时候, 数据库这块是一个大头. sql格式: select 列名/* from 表名 where 条件 ...

  2. Windows平台分布式架构实践 - 负载均衡（下）

    概述 我们在上一篇Windows平台分布式架构实践 - 负载均衡中讨论了Windows平台下通过NLB(Network Load Balancer) 来实现网站的负载均衡,并且通过压力测试演示了它的效 ...

  3. 使用Rest访问Redis中的数据

    原创文章转载请注明出处:@协思, http://zeeman.cnblogs.com   大家在用Redis保存数据的时候,有不同的序列化方式.用得最多应该还是JSON,有一些场景我们需要以Http请 ...

  4. CSharpGL(15)用GLSL渲染2种类型的文字

    CSharpGL(15)用GLSL渲染2种类型的文字 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码中包含10多个独立的Demo,更适合 ...

  5. ABP源码分析十三：缓存Cache实现

    ABP中有两种cache的实现方式:MemroyCache 和 RedisCache. 如下图,两者都继承至ICache接口(准确说是CacheBase抽象类).ABP核心模块封装了MemroyCac ...

  6. 前端移动App开发环境搭建

    移动App开发环境安装 一.环境安装准备软件 二.node的安装 像安装普通软件一样,安装对应版本的node软件,安装好之后就可以运行npm命令行,比如npm init .npm install -g ...

  7. Android开发学习之路-机器学习库（图像识别）、百度翻译

    对于机器学习也不是了解的很深入,今天无意中在GitHub看到一个star的比较多的库,就用着试一试,效果也还行.比是可能比不上TensorFlow的,但是在Android上用起来比较简单,毕竟Tens ...

  8. 修改linux的hosts 后提示“无效的参数”

    碰到个问题,修改linux的主机名问题. vim /etc/hosts 192.168.154.129 129192.168.154.132 132192.168.154.133 133 本地ip是1 ...

  9. memcached安装及.NET中的Memcached.ClientLibrary使用详解

    序言 吹吹牛逼先,借我你的20分钟,保证你在.net中使用memcached缓存数据,畅通无阻,提升数据读取效率,分担数据库压力,便不在话下. 本篇主要说下:memcached分布式缓存的负载均衡配置 ...

  10. 【Win 10应用开发】在RichEditBox中使用自定义菜单

    前面给大伙儿简单介绍了RichEditBox控件的基本用法,以及解决其中的一些小问题. 本文咱们来看看如何自定义RichEditBox控件的上下文菜单. 原理比较简单,所以先说一说原理.当RichEd ...