Question

您好，我正在使用一个Chrome扩展程序来控制网站，并且有以下列表：

它看起来像这样：

<ul class="styles">
<li></li>
<li></li>
<li></li>
etc..

每个li都包含自定义数据

我希望能够通过查找其数据来拉入我想要的数据中的所有数据

data-style-name= "Orange"
href="/example"

我希望能够搜索li的数据--style-name =“橙色”

然后从中提取特定结果，例如href =

是这样的：

const searchStr = "orange";
const lowerSearchStr = searchStr.toLowerCase(); 
const foundItem = (ul .styles all the lis??).find(
    ({ data-name }) => data-name.toLowerCase().includes(lowerSearchStr)
);

我认为类似的东西会起作用。

我想用关键字以及全名找到数据名

，但随后将找到的li里面的特定href多数民众赞成。

谢谢您抽出宝贵的时间阅读本文，如果您能帮助我，我将非常感谢；）<3

Answer 1

您将需要像这样处理每个li，

$("li").each(function() {
allDatas = $(this).data();
search_str = "left";

$.each(allDatas, function(key, val) {
    if(val.length && val.indexOf(search_str) > -1) {
        console.log(val);
    }
});

}）;

Answer 2

如果您希望它完全使用javascript，并且下面的代码与屏幕快照中的代码相同，

search_str       = "orange"; 
search_attr_name = "data-style-name"; 
var all_styles   = my_document.querySelectorAll("[data-style-name]");
matching_url     = "";

if(all_styles.length){
    all_styles.forEach(function(e){ 
        var data_style_name = e.attributes[search_attr_name].value; 
        console.log("TEST data_style_name: ", data_style_name);

        if(data_style_name.length && data_style_name.toLowerCase().indexOf(search_str) > -1) { 

            if(typeof e.attributes["href"].value !== "undefined"){ 
                matching_url = e.attributes["href"].value 
            } 
        }                           
    }); 

    console.log("matching_url: " + matching_url); 
}

通过搜索li内的特定值来提取li内的所有信息

2 个答案: