gpt4 book ai didi

jquery - 鼠标上的复杂 CSS 选择器单击页面中 html 元素的任何部分

转载 作者:行者123 更新时间:2023-12-01 08:16:15 25 4
gpt4 key购买 nike

我使用的是 Jquery 1.7.2。我希望在鼠标单击网页上的任何 html 元素时获得如下所示的输出。

假设 Html 代码是:>

<div id ="mySDiv" class="FT">
<div class="product">
<a href="#">Try</a>
<a href="#">catch</a>
<a href="#">Throw</a>
</div>
</div>

当我点击 anchor 标记“catch”上的 html 元素时,上述代码的输出将是

DIV#mySDIV.FT DIV.product A.eq(2)

我能够得到输出直到低于

DIV#mySDIV.FT DIV.product

为实现目前的输出而编写的代码

    $(document).click(function (e) {
e.preventDefault();
var $parents = $(e.target).parentsUntil('[id]');
var tagNames = $parents.add($parents.parent())
.map(function () {
myCssSelector;
var tagId = $(this).attr("id"); ;
if (tag) {
myCssSelector = this.tagName + "#" + tagId;
var myClassName = $(this).attr("class");
if (myClassName) {
myCssSelector = myCssSelector + "." + myClassName;
}
else {
myCssSelector = myCssSelector + " ";
}
}
else {
myCssSelector = this.tagName;
var myClassName = $(this).attr("class");
if (myClassName) {
myCssSelector = myCssSelector + "." + myClassName;
}
else {
myCssSelector = myCssSelector + " ";
}
}
return myCssSelector;
}).get().join(',');
console.log(tagNames);
});

我无法遍历子节点并计算单击元素的兄弟节点

请帮帮我

最佳答案

http://jsfiddle.net/earlonrails/LCUzy/9/

 $('*').click(function(e){
var tagId = $(this).attr("id");
if (tagId) {
myCssSelector = this.tagName + "#" + tagId;
var myClassName = $(this).attr("class");
if (myClassName) {
myCssSelector = myCssSelector + "." + myClassName;
} else {
myCssSelector = myCssSelector + " ";
}
} else {
myCssSelector = this.tagName;
var myClassName = $(this).attr("class");
if (myClassName) {
myCssSelector = myCssSelector + "." + myClassName;
} else {
myCssSelector = myCssSelector + " " + $(this).index();
}
}
console.log(myCssSelector);
});

关于jquery - 鼠标上的复杂 CSS 选择器单击页面中 html 元素的任何部分,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10561264/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com