javascript - 如何为以下代码编写 document.querySelector

标签 javascript queryselector

我在为以下代码编写document.querySelector时遇到困难。目前我已将此代码编写为 querySelector 但它并不包含所有内容...

请帮助我改进这一点,谢谢。

编辑:由于似乎有些困惑,让我详细说明一下。我希望所有元素,从 div、a、img、所有 都包含在 querySelector 中。

var areaa = document.querySelector("#menu #envelope #links");
<div id="menu">Click here to browse the internet.
	<div id="envelope">
		<div id="links" >
			<div>
				<a id="g" class="redirect">
					<img id="google" src="assets/google.png" />
				</a>
			</div>
			<div style="width: 20%;"></div>
			<div>
				<a id="s" class="redirect">
					<img id="sava" src="assets/Logo_Sava.png"/>
				</a>
			</div>
		</div>
	</div>
</div>

编辑 2 - 因为需要更多代码(根据需要删除/添加 href 元素)...

var menu = document.getElementById("menu");
var areaa = document.querySelectorAll(".areaa");

menu.addEventListener("mouseenter", addHref);
//areaa.addEventListener("mouseleave", remHref);

document.addEventListener("mousemove", function(){
    if(this != areaa){
        remHref();
    }
});

menu.addEventListener("click", addHref);
document.addEventListener("click", function (){
    if (this != areaa){
        remHref();
    }
});

var g = document.getElementById("g");
var s = document.getElementById("s");

function remHref (){
    if (g.hasAttribute("href")){
        g.removeAttribute("href");
    }
    if (s.hasAttribute("href")){
        s.removeAttribute("href");
    }
}

function addHref (){
    setTimeout(activate, 250);
}

function activate (){
    document.getElementById("g").setAttribute("href", "https://www.google.com");
    document.getElementById("s").setAttribute("href", "https://www.example.com");
}

最佳答案

您可能想要向所有要捕获的元素添加一个类,然后使用 document.querySelectorAll

var areaa = document.querySelectorAll(".my-class");

html 应该是这样的:

<div id="menu" class="my-class">Click here to browse the internet.
<div id="envelope" class="my-class">
    <div id="links" class="my-class">
        <div>
            <a id="g" class="redirect">
                <img class="my-class" id="google" src="assets/google.png" />
            </a>
        </div>
        <div style="width: 20%;"></div>
        <div>
            <a id="s" class="redirect">
                <img id="sava" src="assets/Logo_Sava.png"/>
            </a>
        </div>
    </div>
</div>

关于javascript - 如何为以下代码编写 document.querySelector,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60414659/

相关文章:

javascript - 如何更改传单 map 中的默认光标?

javascript - FB.Event.subscribe 不起作用

javascript - JQuery 在 Chrome 中无法运行,但在 Firefox 中可以正常运行

javascript - .GetElementsByName.SelectedIndex 明显更改选项但不是以编程方式更改?

javascript - 找不到带有 document.querySelector 的标签链接

javascript - 对数组中的非后续元素进行排序

javascript - 每日 javascript 倒计时缩短为 jquery

javascript - Angular 中的 document.querySelector

javascript - 多个后代选择器,错误或误解?

javascript - Sizzle 和 document.querySelectorAll 有什么区别