javascript - 我需要创建一个 JavaScript 函数,在给定不带 jquery 的 CSS 选择器的情况下返回 DOM 元素

标签 javascript html css

HTML

我目前使用的 JavaScript

 var $= function(selector){
 var elements = [];
if (selector == "#some_id"){
  elements.push( document.getElementById("some_id"));
}else if (selector == '.some_class'){
  elements= document.getElementsByClassName("some_class");
} else if (selector == "div"){
  elements = document.getElementsByTagName("div");
}else if (selector == "img"){
  elements.push(document.getElementsByTagName("img"));
}
console.log(elements);
return elements;
};

获取嵌套选择器时遇到问题,例如:("img.some_class") 和 ("div.some_class#some_id")

最佳答案

您是否尝试过 querySelectorquerySelectorAll

这里有两个简单的例子:

var el = document.querySelector(".myclass");
var matches = document.querySelectorAll("div.note, div.alert");

更多信息请看这里: https://developer.mozilla.org/en-US/docs/Web/API/document.querySelectorAll

一个非常简单的jQuery选择器模拟:

$ = function (selector) {
  return document.querySelectorAll(selector);
}

关于javascript - 我需要创建一个 JavaScript 函数,在给定不带 jquery 的 CSS 选择器的情况下返回 DOM 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22339272/

相关文章:

javascript - 在悬停时删除图像覆盖

javascript - 如何在HTML和JS文件之间建立双向连接?

javascript - 在 Ember.js 2.3 中,如何将 hasMany 异步调用编译为 ember 中的一个调用而不是多个调用?

Javascript/jQuery onclick 不工作

php - 如何在html中隐藏不需要的空白

html - 如何将动画添加到汉堡菜单 Bootstrap 4?

html - 子元素的宽度改变了,但是父元素的宽度没有改变,为什么?

javascript - 如何在 Angular 中制作交互式 Google 图表(UI 事件)?

javascript - 当我的 Action 中的函数被调用时,除非我取出调度,否则它不会工作

javascript - 动态调整 ag-Grid header 高度