querySelector选择器

querySelector选择器可以通过document和element来调用他们用来代替getElementById var body=document.querySelector("body");//取到body body.appendChild(document.createTextNode("ffff")); var div=document.querySelector("#div1");//取到id为div1的第一个元素 var di…

DOM querySelector选择器

原生的强大DOM选择器querySelector 在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id 等方式来查找,这显然是远远不够的,如果想要进行更为精确的选择不得不使用看起来非常繁琐的正则表达式,或者使用某个库.事实上,现在所有的浏览器厂商都提供了 querySelector 和 querySelectorAll 这两个方法的支持,甚至就连微软也…

querySelector() 选择器语法

选择器示例示例说明 CSS .class .intro 选择所有class="intro"的元素 1 #id #firstname 选择所有id="firstname"的元素 1 * * 选择所有元素 2 element p 选择所有<p>元素 1 element,element div,p 选择所有<div>元素和<p>元素 1 element element div p 选择<div>元素内的所有<p&g…

js 的常用选择器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>$永远保存学习的心态$</title> </head> <body> <div>我是通过标签获取(紫色)</div> <div id="box">我是通过id获取(橙色)<…

js api 之 fetch、querySelector、form、atob及btoa

js api 之 fetch.querySelector.form.atob及btoa 转载请注明出处: https://www.cnblogs.com/funnyzpc/p/11095862.html js api即为JavaScript内置函数,本章就说说几个比较实用的内置函数,内容大致如下: fecth http请求函数 querySelector 选择器 form 表单函数 atob与btoa Base64函数 Base64之atob与btoa 以前,在前端,我们是引入Base64.js…

DOM的选择器

这几天学习了DOM的选择器,现在来进行一下总结分类. 1.DOM里的元素节点选择器元素节点选择器包括id,class,name,tagname,高级,关系. 1.1 id选择器 id:返回的是单个对象相关标签代码 <body> <div id="box">1</div> <div id="box">2</div> <div id="box">3</div> &…

关于DOM的一些总结（未完待续......）

DOM 实例1:购物车实例(数量,小计和总计的变化) 这里主要是如何获取页面元素的节点: document.getElementById("...") cocument.querySelector("选择器"); 通过所需的元素节点,得到我们想要的数据做运算. 实例2:伸缩二级菜单这里主要是逻辑判断,不同的逻辑给不同的className来控制样式. 需求是:一级菜单可以都关闭,但最多只有一个能打开.(思路是,每次都将所有的一级菜单关闭,然后仅打开当前点击的元素,并…

DOM查找元素

1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查找某一个元素 2. 按标签名(TagName)查找多个元素: var elems=element.getElementsByTagName("标签名"); 返回值:HTMLCollection类型的对象——动态集合如何获得一个元素对象: elems[i] elems["name…

11-17的学习总结(DOMfirstday)

HTML: 超文本标记语言,专门定义网页内容的语言 XHTML: 严格的HTML标准 DHTML: 所有实现网页动态效果技术的统称 XML: 可扩展的标记语言,标签都是自定义的 XML语法和HTML语法完全相同!——结构化数据 Node类型 nodetype 返回数字 nodeName("元素名称的大写形式") 当前节点的名称 nodevalue获得当前节点的值,对元素节点无效递回遍历节点树(尤其重要!) 算法:深度优先遍历! 优先遍历下级节点,直到碰到叶子节点,才返回并更换另一个…

DOM&BOM笔记

day01正课:1. DOM概述2. ***DOM树3. *查找 1. DOM概述: DHTML:动态网页技术的统称 DHTML=HTML+CSS+JS 鄙视题: HTML XHTML DHTML XML: HTML:超文本标记语言,专门编写网页内容的语言 XHTML:严格的HTML语言标准 DHTML:动态网页技术的统称,=HTML+CSS+JS XML:可扩展的标记语言,可自定义标签专门用来存储/传输自描述的结构化数据逐渐被json替代了 <演员> <姓名>范冰冰</…

jQuery总结---版本一

day01--- jQuery是一个函数库,简化了DOM操作,屏蔽了浏览器兼容性问题.函数分为4类 (1)DOM操作 (2)事件处理 (3)动画 (4)AJAX jQuery3的新特性有哪些? 1. 移除旧的IE工作区 2. jQuery 3.0运行在Strict Mode下 3. 引进for...of循环 4. 动画方面采用新的API 5. 对包含特殊含义的字符串提供转义的新方法 6. 类操作方法支持SVG 7. 延迟对象现在与JS Promises兼容 8. jQuery.when()对于多…

常用数组、字符串方法总结&获取元素、DOM操作

字符串的方法.返回值.是否改变原字符串:1 charAt() 方法可返回指定位置的字符. 不改变原始字符串 JavaScript并没有一种有别于字符串类型的字符数据类型,返回的字符是长度为 1 的字符串: 注释:字符串中第一个字符的下标是 0.如果参数 index 不在 0 与 string.length 之间,该方法将返回一个空字符串. 2 concat() 方法用于连接两个或多个字符串并返回连接后的字符串不改变原始字符串语法:stringObject.concat(stringX,str…

一文入门HTML5

1.HTML5 上节回顾:一文读懂ES6(附PY3对比) | 一文入门NodeJS 演示demo:https://github.com/lotapp/BaseCode/tree/master/javascript/0.H5_C3/H5 参考文档:https://www.w3cschool.cn/html5 | https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5 HTML5主要目的是为了在移动设备上支持多媒体,eg:<vide…