首页 > TAG信息列表 > querySelector

慕课培训平台

// ==UserScript== // @name 平台培训 // @namespace http://tampermonkey.net/ // @version 0.1 // @description try to take over the world! // @author You // @match // @match // @icon // @grant none // ==/Use

2022-08-25 第二小组 张鑫 学习笔记

实训四十七天 元素操作 BOM 1.学习内容 自定义属性 设置元素属性 <div haha="abc" id="xyz"></div> <script> let div = document.querySelector("div"); //获取属性值 //元素.属性名 的方式只能适用于元素原生的属性 console.log(div.getAttribute(&

2022-08-24 第五组 赖哲栋 学习笔记

JavaScript JavaScript脚本语言,解释型,主要用来给HTML网页增加动态功能 通常的js是运行在浏览器环境下的 JS的两种模型 DOM:文档对象模型 document BOM:浏览器对象模型 window nodejs运行在计算机环境下,服务器技术。不能操作BOM和DOM,但是它可以操作文件,实际上是一门后端技术 JS解

2022-08-24 第四小组 王星苹 学习笔记

学习心得 自动类型推断 数字 number var v1 = 10;  var v2 = 1.5; 字符串 string var v3 = "你好"; var v4 = '我好'; 布尔型 boolean           var v5 = true; null 空。定义了但是值为空 var v6 = null; undefind 未定义,没有声明过   Na

图片的宽和高说明

有如下代码 <!--网格动态背景开始--> <img src="http://dmoe.cc/random.php" id="back-img"/> <!-- 设置定时每10秒切换背景图片 --> <script> setInterval(()=>{ document.querySelector("#back-img").src = "http://dmo

WebAPI

一.Dom获取和属性操作 1.获取元素 1.1 根据css选择器来获取DOM元素(重点) 1.选择器匹配的第一个元素document.querySelector('css选择器');2.选择匹配多个元素//返回指定的选择器的所有元素对象集合document.querySelectorAll('css选择器')//querSelector() 返回指定选择器的第一

JS:表单登陆验证

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title></title> </head> <body> <style> #p1, #p2 {

通过关系获取节点

<div id="box1">hello <div class="box2" id="box4">2</div> <div class="box2"> <div class="box3" id="box5"></div>

JavaScript——DOM(获取元素和操作元素)

一、获取元素的几种方法 getElementById、getElementsByTagName、getElementsByClassName、querySelector、querySelectorAll document.body、document.documentElement 1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset=&quo

Web APIS 第二天

事件监听   绑定事件 , 注册事件 , 事件监听     事件源 . addEventListener( '事件' , 事件处理函数 )     1. 随机点名案例   // 数据数组 let arr = ['马超', '黄忠', '赵云', '关羽', '张飞']function getRandom(min, max) { return Math.floor(Math.rand

web进阶

DOM节点操作(上) 1、获取id名为container的div元素,请补全横线处代码 document.________('div#container') 答案:queryselector 2、获取ul中的第2个li元素,请补全横线处数字 document.querySelectorAll('ul li')[________] 答案:1 3、点击确认按钮把当前整行背景色设置为蓝色,请补全横线

用于H5播放器的js快捷命令(倍速,跳过)

这两个命令直接复制到书签网址里,使用时直接点击书签即可。 一些需要注意的: 快进速度最高为16倍; 跳过在一些禁止拖动进度条的视频无效;     16倍速播放 javascript:document.querySelector('video').playbackRate=16;   跳过该视频 javascript:document.querySelector('video'

JSDOM操作

div、p是元素节点,content是文本节点,title是属性节点 创建节点 createElement 创建新元素,接受一个参数,即要创建元素的标签名 let div = document.createElement('div') createTextNode 创建一个文本节点 let text = document.createTextNode("content"); createAttribute 创建属

JavaScript小案例-留言板案例

简单版发布留言案例 留言后没有时间,没有键盘监听 <body> <textarea name="" id=""></textarea> <button>发布</button> <ul> </ul> <script> // 1. 获取元素 var btn = document.querySelec

ios键盘把页面顶起来看不见顶部header内容

ios键盘顶起页面是ios的bug,为了就是不让输入框被键盘挡住。但是他妈你为啥让页面超出显示呢?本来不能滚动的页面,让你给弄成能滚动了。 我的解决思路是,首先给页面添加 scroll ,滚动监听。然后利用visualViewport 给他添加一个resize监听,当键盘弹起resize监听到了,视图高度发生改变,这

JS之下拉菜单案例鼠标经过显示

// 1. 获取元素 var nav = document.querySelector('.nav'); var lis = nav.children; //得到4个小li // 2.循环注册事件 for(var i=0;i<lis.length;i++){ lis[i].onmouseover = function(){ this.children[1].style.display = 'block'; } lis[i].onmouseout = funct

bootstrap上传

<link href="~/Resources/bootstrap/Fileinput/css/fileinput.min.css" rel="stylesheet" /> <script src="~/Resources/bootstrap/Fileinput/js/fileinput.min.js"></script> <script src="~/Resources/bootstrap/F

本地存储之localStorage

1.生命周期永久生效,除非手动删除 否则关闭页面也会存在 2.可以多个窗口(页面)共享(同一浏览器可以共享) 3.以键位对的形式存储使用 存储数据:   localStorage.setItem() 获取数据: localStorage.getItem() 删除数据: localStorage.removeItem 删除所有数据: localStorage.clear

表格添加

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d

本地存储

本地存储的特性   1、数据是存储在用户的浏览器中。   2、设置、读取方便,甚至页面刷新或关闭都不会丢失数据。   3、容量较大,sessionStorage 约 5M、localStorage 约 20M。   4、只能存储字符串,可以将对象 JSON.stringify() 编码后存储。 window.sessionStorage   1

获取天气api

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <style

B站跳过充电鸣谢

在Tampermonkey中新建脚本,输入以下代码: const bv = document.querySelector('bwp-video') || document.querySelector('video') if (bv) { bv.onended=()=>{ setTimeout(()=>{ document.querySelector('.bi

javascript-web APIs

web APIs和JS的基础关联性 Web APIs 主要学习DOM和BOM js独有部分 页面交互效果 js的应用 API:应用程序编程接口,给程序员提供的一种工具,以便轻松的实现想要完成的功能。 web API:是浏览器提供的一套操作浏览器功能和页面元素的AP I(BOM和DOM)   总结: API是为我们程序员提供一个

input框限制输入金额

    HTML: <input type="tel" class="capital mui-input-clear" value="0.00">   <div class="redbag_box4_son">¥0.00</div>   JS: $(document).ready(function(){     // 限制文本框只能输入数字和小数点     var precapita

JavaScript中WebAPI知识

目录 1、什么是WebAPI 2、DOM中的基本概念 2.1、DOM树(文档对象类型) 3、获取元素和事件 3.1、获取元素 ?3.2、事件 4、操作元素 4.1、获取/修改元素中的内容 4.2、获取/修改元素中的属性 4.3、获取/修改表单元素中属性 4.4、获取修改样式属性 4、如何操作节点 4.1、新增节点 1