dom操作原生js巩固

原生js的dom操作巩固

前言:这玩意其实很简单,但是每次用的时候都有点含糊,故写个文章,每次忘得时候看一看

原生dom操作

1、创建dom元素:createElement(标签名)

2、删除dom元素:removeChild(标签名)

3、在什么元素后添加dom元素:元素.appendChild(标签名)

4、在什么元素前添加dom元素:元素.insertBefore(标签名)

5、替换dom元素:replace(插入的元素,被替换的元素)

6、获取父节点:parentNode

7、获取子节点:childNodes

8、获取第一个子节点:firstChild

9、获取最后一个子节点:lastChild

原文:大专栏 dom操作原生js巩固

原文地址：https://www.cnblogs.com/petewell/p/11601779.html

时间： 2024-10-07 01:20:40

dom操作原生js巩固的相关文章

js以字符串方式创建DOM（原生js，jquery，extjs）

原生js <script type="text/javascript"> var divHtml= '<div>'+ '<ul>'+ '<li>'+ '<a href="#">something added</a>'+ '</li>'+ '</ul>'+ '</div>'; var div=document.createElement('div'); div.

JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

前言絮叨絮叨这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学,经过初步的学习,会对这一门语言有了一定深入的了解,也会感受到这一门语言的强大之处.希望各位同学通过一定的学习,会得到等大的收获. 因为是最后一篇所以内容可能有点多,希望各位同学能够慢慢看,细细看,让我们一起学习,一起进步,一起感受JS的魅力. 一函数函数的声明及调用 1.函数的声明格式: func

DOM操作、js获取id的内容和修改原来的内容（innerHTML）

js获取id的内容(getElementById) 和修改原来的内容(innerHTML) 1.通过ID获取元素学过HTML/CSS样式,都知道,网页由标签将信息组织起来,而标签的id属性值是唯一的,就像是每人有一个身份证号一样,只要通过身份证号就可以找到相对应的人.那么在网页中,我们通过id先找到标签,然后进行操作. 语法: document.getElementById(“id”) 看看下面代码: 结果:null或[object HTMLParagraphElement] 注:获取的元

常见的dom操作----原生JavaScript与jQuery

1.创建元素文本节点 JavaScript: document.createElement(),只接收一个参数,创建后需要手动将其添加到文档树中,例如: var newDiv = document.createElement("div");if(document.body){ document.body.appendChild(newDiv);}else{ document.documentElement.appendChild(newDiv);} document.createTe

BOM操作 DOM操作

BOM操作 ( B指代的是浏览器 ) BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行"对话". window对象所有浏览器都支持 window 对象.它表示浏览器窗口. **如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象.* **没有应用于 window 对象的公开标准,不过所有浏览器都支持该对象.* 所

认识JQuery，JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作，常用的方法

(一)认识JQuery JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法 JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法格式:$(selector).actio

原生JS与jQuery操作DOM有什么异同点？

本文和大家分享的主要是原生JS与jQuery操作DOM相关内容,一起来看看吧,希望对大家学习javascript有所帮助. 一.创建元素节点 1.1 原生 JS 创建元素节点 document.createElement("p"); 1.2 jQuery 创建元素节点 $('<p></p>');` 二.创建并添加文本节点 2.1 原生JS创建文本节点 document.createTextNode("Text Content"); 通常创建文

原生js操作dom的方法

今天学习了原生js的dom节点的操作,就记录下来,仅供自己以后参考. 1)创建节点:除了可以使用createElement创建元素,也可以使用createTextNode创建文本节点. document.body指向的是<body>元素;document.documentElement则指向<html>元素 //创建节点 var createNode = document.createElement("div"); var createTextNod

原生js和Jquery操作DOM

原生javascript和jQuery操作DOM的对比总结目录: DOM元素节点:1)文档节点:2)元素节点:3)属性节点:4)文本节点:5)注释节点 1)创建节点 2)选择(访问)节点 3)操作: 1)节点操作 1)添加节点 2)删除节点 3)修改内容: 1)文本[text] 2)html 3)表单val 4)改变事件 2)CSS操作 3)动画下文转自:http://www.jb51.net/article/103583.htm 这篇文章主要给大家介绍了原生JS和jQuery操作DOM的一