[英]Return all elements for which any attribute starts with something
I'm aware of [name^="value"]
selector but is there a analogous selector (or technique) that queries all attributes starting with the given value? 我知道[name^="value"]
选择器,但是有一个类似的选择器(或技术)查询以给定值开头的所有属性吗?
I'm looking for something like $("[*^='http://www.something.com']")
(that does not exist). 我正在寻找类似$("[*^='http://www.something.com']")
(不存在)。
It would match all elements which contains at least one attribute with a value that begins with http://www.something.com
. 它将匹配包含至少一个属性的所有元素,其值以http://www.something.com
开头。
Say: 说:
<img src="http://www.something.com/image.jpg" />
<a href="http://www.something.com">Something</a>
<link rel="stylesheet" href="http://www.something.com/css/style.css" type="text/css">
Attribute name could be anything, not just src
and href
, even non standard attributes. 属性名称可以是任何东西,不仅仅是src
和href
,甚至是非标准属性。
Is there a known way to do it? 有没有一种已知的方法呢?
I've put together some of the ideas from other answers and wrote a custom selector. 我从其他答案中汇总了一些想法并编写了一个自定义选择器。
$.expr[':'].hasAttrStartingWithValue = function (obj, index, meta) {
var startsWithAttrValue = false;
var value = meta[3];
for (var i = 0; i < obj.attributes.length; i++) {
var attr = obj.attributes[i];
// attr.value starts with value
if (attr.specified && attr.value.lastIndexOf(value, 0) === 0) {
startsWithAttrValue = true;
break;
}
}
return startsWithAttrValue;
};
It has not been properly tested for cross-browsing and correctness, and I'm sure that it can be further optimized, but it seems to be working well with IE 11, FF 24 and Chrome 32. 它没有经过适当的交叉浏览和正确性测试,我确信它可以进一步优化,但它似乎与IE 11,FF 24和Chrome 32一起运行良好。
// Logs every occurrence of a value in any attribute of the page
$(":hasAttrStartingWithValue('http://www.something.com')").each(function (i, e) {
console.log(i + " - " + e.outerHTML);
});
// Matches only children of test
$("#test :hasAttrStartingWithValue('http://www.something.com')")
.css('background-color', 'red');
Working Fiddle . 工作小提琴 。
If you want to do it for img, a, and link tags, then you could do it like this: 如果你想为img,a和link标签做,那么你可以这样做:
var ref = '"http://www.something.com"';
var elems = [].slice.call(document.querySelectorAll('img[src='+ref+'], a[href='+ref+'], link[href='+ref+']'));
//do something with the elems array
If you want to go the other route... 如果你想走另一条路......
JS Fiddle of Working Abomination in Vanilla JS JS香草JS工作憎恶的小提琴
Code that makes me sad (query everything in sight, loops in loops, regex in loops, etc.): 令我伤心的代码(查看所有内容,循环循环,循环中的正则表达式等):
var rx = /(^http:\/\/www.something.com)/;
var loopAgain = function () {
for (var j = 0, leng = attrs.length; j < leng; j++) {
if (rx.test(attrs[j].value)) {
return true;
}
return false;
}
};
var allTheThings = [].slice.call(document.querySelectorAll('*'));
for (var i = 0, len = allTheThings.length; i < len; i++) {
var attrs = allTheThings[i].attributes;
if (loopAgain()) {
console.log(allTheThings[i]);
}
}
function strstr (haystack, needle, bool) {
var pos = 0;
haystack += '';
pos = haystack.indexOf(needle);
if (pos == -1) {
return false;
} else {
if (bool) {
return haystack.substr(0, pos);
} else {
return haystack.slice(pos);
}
}
}
$( document ).ready(function(){
$('*').each(function() {
$.each(this.attributes, function() {
// this.attributes is not a plain object, but an array
// of attribute nodes, which contain both the name and value
if(this.specified) {
if( strstr(this.value,'http://') )
alert(this.name+'+'+this.value);
}
});
});
});
Alert All attributes And values... 警报所有属性和值...
Custom this code... 自定义此代码......
jsfiddle 的jsfiddle
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.