javascript选择器的封装，只需要写元素名或css类及id都可以选择到元素
//模仿jquery选择器样式，只需要写元素名或css类及id都可以选择到元素
<html><head><meta http-equiv="Content-Type:text/html;charset=utf=8"/><link rel="shortcut icon" href="#"/><title>封装选择器</title></head><style type="text/css">.context {color:black;font-size: 16px;width: 300px;height: 300px;}.div{border: 1px solid blue;}</style><body><div class="context div" >这是文本内容<ul><li class="listyle"><input type="text" name="user" value=""/></li><li class="listyle"><input type="password" name="pwd" value=""/></li><li class="listyle"><input type="password" name="pwd1" value=""/></li></ul></div><script type="text/javascript">Function.prototype.addMethods=function(name,fn){this.prototype[name]=fn;}function selectEle(selector){var selector=this.trim(selector);this.elements=[];var node;if(selector.indexOf(' ')!==-1){node=this.getClass(selector)[0];if(node){this.elements.push(node);}else if(node=this.getTagName(selector)){if(node.length>1){for(var i=0;i<node.length;i++){this.elements.push(node[i]);}}}else{throw "请输入正确的选择符";}}else if(selector.indexOf('[')!==-1){var selector=selector.slice(1,-1);node=this.getAttr(selector);//console.log(this.getAttr(selector));if(node){this.elements.push(node);}else{alert("请输入正确的选择符");}}else{if(/^[#|.]/.test(selector)){node=this.getCss(selector);if(node){this.elements.push(node);}else{alert("请输入正确的选择符");}}else{node=this.getTagName(selector);if(node.length==1){this.elements.push(node[0]);}else if(node.length>1){for(var i=0;i<node.length;i++){this.elements.push(node[i]);}}else{alert('请输入正确的选择符');}} }return this.elements;}selectEle.addMethods('getClass',function(selector){return document.getElementsByClassName(selector);});selectEle.addMethods('getCss',function(selector){try{return document.querySelector(selector);}catch(err){alert(err);}});selectEle.addMethods('getTagName',function(selector){try{return document.querySelectorAll(selector);}catch(err){alert(err);}});selectEle.addMethods('getAttr',function(selector){try{var tag=document.body.getElementsByTagName('*');var ele=[];if(selector.indexOf('=')==-1){for(var i=0;i<tag.length;i++){if(tag[i].getAttribute(selector)!=undefined && tag[i].tagName !="SCRIPT"){ele.push(tag[i]);}}}else{var selector=selector.split('=');for(var i=0;i<tag.length;i++){var att=tag[i].getAttribute(selector[0]);//console.log(att);if(att && att!=="text/javascript" && att!=="text/css"){if(att.toString().toLocaleLowerCase()===selector[1].toString().toLocaleLowerCase()){ele.push(tag[i]);}}}}return ele;}catch(err){alert(err);}});//只是为测试IE7/8写的临时兼容去空白函数selectEle.addMethods('trim',function(str){return str.replace(/^\s\s*/,'').replace(/\s\s*$/,'');});var $=function(args){return new selectEle(args);}console.log($('li'));</script> </body>
</html>
相关文章：
javascript选择器的封装，只需要写元素名或css类及id都可以选择到元素
//模仿jquery选择器样式，只需要写元素名或css类及id都可以选择到元素 <html><head><meta http-equiv"Content-Type:text/html;charsetutf8"/><link rel"shortcut icon" href"#"/><title>封装选择器&l…...
机器学习第7天：逻辑回归
文章目录 介绍 概率计算 逻辑回归的损失函数 单个实例的成本函数 整个训练集的成本函数 鸢尾花数据集上的逻辑回归 Softmax回归 Softmax回归数学公式 Softmax回归损失函数 调用代码 参数说明 结语 介绍 作用：使用回归算法进行分类任务 思想：…...
努力奋斗,遇上对的人
...
基于单片机音乐弹奏播放DS1302万年历显示及源程序
一、系统方案 1、本设计采用51单片机作为主控器。 2、DS1302计时显示年月日时分秒。 3、按键可以弹奏以及播放音乐，内置16首音乐。 二、硬件设计 原理图如下： 三、单片机软件设计 1、首先是系统初始化 /时钟显示**/ void init_1602_ds1302() { write…...
ceph学习笔记
ceph ceph osd lspoolsrbd ls -p testpool#查看 ceph 集群中有多少个 pool,并且每个 pool 容量及利 用情况 rados dfceph -sceph osd tree ceph dfceph versionsceph osd pool lsceph osd crush rule dumpceph auth print-key client.adminceph orch host lsceph crash lsceph…...
SQLSERVER 遍历循环的两种方式很详细有源码(2)
2.游标循环 Create table WS_Student ( [Id] int primary key not null, [My_Cocode] [int], [My_SCocode] [int], [userId] [bigint], [SetCName] [varchar](50) NULL, [SetEName] [varchar](50) NULL, [SetPcode] [varchar](50) NULL, [Se…...
flutter背景图片设置
本地图片设置 1、在配置文件pubspec.yaml中，设置以下代码 assets:- assets/- assets/test/2、如果目录中没有assets文件夹，则创建一个文件夹，并且取名为assets，在此文件夹中存放图片资源即可，如果想分文件夹管理&…...
【运维 监控】Grafana + Prometheus，监控Linux
安装和配置Grafana与Prometheus需要一些步骤，下面是一个简单的指南： 安装 Prometheus： 使用包管理器安装 Prometheus。在 Debian/Ubuntu 上，可以使用以下命令： sudo apt-get update sudo apt-get install prometheus在…...
Sentinel底层原理（下）
1、概述 Sentinel的核心原理，也就是前面提到暗流涌动的SphU.entry(…)这行代码背后的逻辑。 Sentinel会为每个资源创建一个处理链条，就是一个责任链，第一次访问这个资源的时候创建，之后就一直复用，所以这个处理链条每…...
竞赛选题 疫情数据分析与3D可视化 - python 大数据
文章目录 0 前言1 课题背景2 实现效果3 设计原理4 部分代码5 最后 0 前言 🔥 优质竞赛项目系列，今天要分享的是 🚩 大数据全国疫情数据分析与3D可视化 该项目较为新颖，适合作为竞赛课题方向，学长非常推荐࿰…...
macos 配置ndk环境
选择Android Studio下默认的ndk环境 mac电脑的ndk默认路径一般是 /Users/user_name/Library/Android/sdk/ndk/version_code 其中user_name为自己电脑的用户名，version_code为自己ndk安装的版本号，比如我这里电脑的ndk路径就是 /Users/zhangsan/Libra…...
【linux】进行间通信——共享内存+消息队列+信号量
共享内存消息队列信号量 1.共享内存1.1共享内存的原理1.2共享内存的概念1.3接口的认识1.4实操comm.hppservice.cc （写）clint.cc （读） 1.5共享内存的总结1.6共享内存的内核结构 2.消息队列2.1原理2.2接口 3.信号量3.1信号量是什么3…...
PlantUML基础使用教程
环境搭建 IDEA插件下载 打开IEDA系列IDE，从FIle–>Settings–>Plugins–>Marketplace 进入到插件下载界面，搜索PlantUML，安装PlantUML Integration和PlantUML Parser两个插件，并重启IDE 安装和配置Graphviz 进入官网…...
Redis：新的3种数据类型Bitmaps、HyperLoglog、Geographic
目录 Bitmaps简介常用命令bitmaps与set比较 HyperLoglog简介命令 Geographic简介命令 Bitmaps 简介 位操作字符串。 现代计算机使用二进制（位）作为信息的基本单位，1个字节等于8位，例如“abc”字符串是有3个字节组成，…...
promise时效架构升级方案的实施及落地 | 京东物流技术团队
一、项目背景 为什么需要架构升级 promise时效包含两个子系统：内核时效计算系统（系统核心是时效计算）和组件化时效系统（系统核心是复杂业务处理以及多种时效业务聚合，承接结算下单黄金流程流量）ÿ…...
es的使用方法以及概念
Elasticsearch（简称为ES）是一个开源的搜索引擎，它构建在Lucene搜索引擎之上。它提供了一个分布式、多租户的全文搜索引擎，具有强大的实时分析能力。以下是关于Elasticsearch的一些基本概念和使用方法： 基本概念&#…...
WPF xaml Command用法介绍
WPF (Windows Presentation Foundation) 中的命令设计模式是一种用于分离用户界面逻辑和业务逻辑的方法。在WPF中，这种模式通过命令接口（如 ICommand）实现，使得用户界面组件（如按钮、菜单项等）可以触发不直…...
微信小程序动态生成表单来啦！你再也不需要手写表单了！
dc-vant-form 由于我们在小程序上涉及到数据采集业务，需要经常使用表单，微信小程序的表单使用起来非常麻烦，数据和表单是分离的，每个输入框都需要做数据处理才能实现响应式数据，所以我开发了dc-vant-form，…...
顺序表（数据结构与算法）
✅✅✅✅✅✅✅✅✅✅✅✅✅✅✅✅ ✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨ 🌿🌿🌿🌿🌿🌿🌿🌿🌿🌿🌿🌿🌿🌿…...
【大连民族大学C语言CG题库练习题】——判断一个矩阵是另一个矩阵的子矩阵
【问题描述】 从标准输入中输入一个N（N<9）阶矩阵和一个M（M<N）阶矩阵，判断矩阵M是否是N的子矩阵，若是则输出M在N中的起始位置，若不是则输出-1。若矩阵M能与N中某一区域完全相等࿰…...
手把手教你用Claude Desktop的MCP协议，5分钟搞定本地SQLite数据库查询
5分钟实现自然语言查询SQLite：Claude Desktop MCP协议实战指南 想象一下这样的场景：你手头有一个存储着上万条商品信息的SQLite数据库，现在需要快速统计某个品类的库存数量。传统方式可能需要打开数据库工具、编写SQL查询语句，或者…...
11.0592MHz晶振在51单片机串口通信中的优势解析
1. 为什么11.0592MHz晶振成为单片机工程师的首选在嵌入式系统设计中，晶振的选择往往决定了整个系统的稳定性和精度。作为一名从事单片机开发多年的工程师，我发现11.0592MHz的晶振在51单片机项目中出现的频率异常高。这绝非偶然，而是由一系列精…...
QT 基于qcustomplot实现热力图（四）：动态数据流与交互优化实战
1. 动态数据流的核心实现策略 在实时监控系统中，热力图的数据往往需要持续更新。我遇到过不少开发者直接粗暴地全量刷新整个数据集，结果界面卡顿得像老式幻灯片。这里分享三种经过实战检验的动态更新方案，每种都有其适用场景。 增量更新法最适…...
Qwen3.5-9B-AWQ-4bit多场景落地：零售货架图分析+缺货识别+SKU自动计数
Qwen3.5-9B-AWQ-4bit多场景落地：零售货架图分析缺货识别SKU自动计数 1. 零售场景中的视觉理解挑战 在零售行业，货架管理一直是运营效率的关键指标。传统的人工巡检方式存在几个明显痛点： 效率低下：一个中型超市需要2-3小时完成…...
NCCL中RoCE与RDMA的深度解析：如何优化分布式训练网络性能
1. 为什么RoCE和RDMA对分布式训练如此重要？ 第一次接触分布式训练时，我盯着日志里不断跳动的通信耗时直发愁。8块GPU明明都在满负荷运转，但总训练时间就是比单卡8要长不少。后来用NVIDIA的Nsight工具一分析，发现超过30%的时间都花…...
从零到一：深度解析BertTokenizer.from_pretrained的加载机制与实战技巧
1. 初识BertTokenizer.from_pretrained：你的NLP敲门砖 第一次接触Hugging Face的Transformers库时，我被BertTokenizer.from_pretrained()这个方法深深吸引了。它就像是一把万能钥匙，能快速打开各种预训练语言模型的大门。记得当时我尝试用传统…...
终极指南：如何构建现代化微服务架构 - Zend Framework Expressive完整教程
终极指南：如何构建现代化微服务架构 - Zend Framework Expressive完整教程 【免费下载链接】zendframework Official Zend Framework repository 项目地址: https://gitcode.com/gh_mirrors/ze/zendframework 在当今快速发展的微服务架构时代，PHP…...
Qwen3-14B芯片设计辅助：Verilog注释生成、RTL代码解释、DFT建议
Qwen3-14B芯片设计辅助：Verilog注释生成、RTL代码解释、DFT建议 1. 镜像概述与硬件适配 Qwen3-14B私有部署镜像是专为芯片设计工程师打造的AI辅助工具，基于通义千问大语言模型优化定制。该镜像完美适配RTX 4090D 24GB显存配置，预装了完整的…...
5分钟掌握Goldberg模拟器：告别Steam限制，畅玩单机游戏
5分钟掌握Goldberg模拟器：告别Steam限制，畅玩单机游戏 【免费下载链接】gbe_fork Fork of https://gitlab.com/Mr_Goldberg/goldberg_emulator 项目地址: https://gitcode.com/gh_mirrors/gbe/gbe_fork 你是否厌倦了Steam平台的网络限制ÿ…...
7天掌握Driver Store Explorer：Windows驱动管理的完整指南
7天掌握Driver Store Explorer：Windows驱动管理的完整指南 【免费下载链接】DriverStoreExplorer Driver Store Explorer [RAPR] 项目地址: https://gitcode.com/gh_mirrors/dr/DriverStoreExplorer Driver Store Explorer（简称RAPR）是…...