一個小誤區 JS中的contains

今天想要用JS判斷集合中是否包含另一個集合。

發現，Contains並不能達到所要的效果，查詢之後發現了問題

原來，js的contains方法用來檢視dom元素的包含關係，並不是Java中陣列的contains方法。

先看一下duyunchao同學分享的程式碼

$(document).ready(function() {
				var Arrays = ['11','22','33'];
				var Array ='11';
				if(Arrays.indexOf(Array) >= 0) {
					alert('Arrays中包含Array');
				}
			});

若js要判斷陣列的包含關係，應該用indexof

原生JS中是有contains方法的，但只有dom元素的包含關係，這裡我們就為大家分享一下擴充套件的字元string與陣列arr的擴充套件程式碼

結構與測試程式碼如下

<div id="div1">
<div id="div2">
jb51.net
</div>
</div>
<script type="text/javascript">
var div1= document.getElementById("div1");
var div2= document.getElementById("div2");
console.log(div1.contains(div2));

var str1="jb51.net";
var str2="jb51";
console.log(str1.contains(str2));
</script>

但它並不是字串方法，，僅用於判斷DOM元素的包含關係，引數是Element型別

若要在JS中判斷倆字串的包含關係，用indexOf()

但是我們可以通過擴充套件的方法來實現

<div id="div1">
<div id="div2">
jb51.net
</div>
</div>
<script type="text/javascript">
var div1= document.getElementById("div1");
var div2= document.getElementById("div2");
console.log("div1.contains(div2)="+div1.contains(div2));

//字元擴充套件contains就不會報錯了
String.prototype.contains = function(a) {
 return - 1 < this.indexOf(a)
};

var str1="jb51.net";
var str2="jb51";
console.log("str1.contains(str2)="+str1.contains(str2));

//陣列擴充套件contains適用於陣列判斷
Array.prototype.contains = function(a) {
 if ("string" == typeof a || "number" == typeof a) for (var b in this) if (a == this[b]) return ! 0;
 return ! 1
};

var arr1=["jb51.net","jbzj.com","jb51.com"];
var str3="jb51.net";
console.log("arr1.contains(str3)="+arr1.contains(str3));
</script>

下面是執行結果

所以後期我們的程式碼可以加上這兩段即可

//字元擴充套件contains就不會報錯了
String.prototype.contains = function(a) {
 return - 1 < this.indexOf(a)
};
//陣列擴充套件contains適用於陣列判斷
Array.prototype.contains = function(a) {
 if ("string" == typeof a || "number" == typeof a) for (var b in this) if (a == this[b]) return ! 0;
 return ! 1
};

以上就是javascript中contains是否包含功能實現程式碼(擴充套件字元、陣列、dom)的詳細內容，更多關於js contains的資料請關注我們其它相關文章！