jquery 怎样做一个className列表？

mingfish 2010-01-03 11:09:27

我想做一个class名称列表放到数组中去，里面没有空元素和重复项，请问怎么做，下面的代码有缺陷，请高手帮忙改改。



<script type="text/javascript" src="http://localhost/leb/auto/js/jquery-latest.js"></script>

<script type="text/javascript">

	function output_css(){

		var css_sheet=[];

		for(var i in $(".page *")){

			var css_name=$(".page *")[i].className;

			if(css_name!=""){

				css_sheet.push(css_name);

			}

		}

		alert(css_sheet);

	}

	$(function(){

		output_css();		//输出的结构很多“,,,,,,”空元素。

	})

</script>

<body>

	<div class="page">

		<div class="head">

			<div class="line">

				<div class="mod logo" >

					<div class="inner">

						<div class="hd ">

							<h3>logo</h3>

						</div>

						<div class="bd li li_24 li_h24">

							<ul>

								<li><a href="#">测试</a></li>

							</ul>

						</div>

					</div>

				</div>

			</div>

			<div class="line"></div>

			<div class="line"></div>

		</div>

		<div class="body">

			.....

		</div>

		<div class="foot">

			.....

		</div>

	</div>

</body>

...全文

110 6 打赏收藏举报

写回复

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

mingfish 2010-01-04

打赏
举报

组合各位的意见，自己写了一个，复杂了点



<script type="text/javascript">

var class_sheet=[];

function output_css(){

	var classList = "";

	var classList2 = "";

	var temp_array=[];

	$(".page *").each(function(i){

		var curClass = $(this).attr('class').replace(/(^\s)|(\s$)/,"");

		classList=classList+" "+curClass;

		temp_array=classList.split(" ");

		for (var i in temp_array){

			if((classList2.indexOf(temp_array[i]+" "))==-1){

				classList2=classList2+temp_array[i]+" ";

			}

		}

	});

	classList2=classList2.replace(/(^\s)|(\s$)/g, "");

	class_sheet=classList2.split(" ");

}

$(function(){

	output_css();

})

</script>

singlion 2010-01-04

打赏
举报

[Quote=引用 5 楼 mingfish 的回复:]
组合各位的意见，自己写了一个，复杂了点
JScript code<script type="text/javascript">var class_sheet=[];function output_css(){var classList="";var classList2="";var temp_array=[];
$(".page *").each(function(i){var curClass= $(this).attr('class').replace(/(^\s)|(\s$)/,"");
classList=classList+""+curClass;
temp_array=classList.split("");for (var iin temp_array){if((classList2.indexOf(temp_array[i]+""))==-1){
classList2=classList2+temp_array[i]+"";
}
}
});
classList2=classList2.replace(/(^\s)|(\s$)/g,"");
class_sheet=classList2.split("");
}
$(function(){
output_css();
})</script>
[/Quote]

有些元素可能没有class属性，就不用判断了，把$(".page *")改成$(".page *[class]")可能更好点吧

mrshelly 2010-01-03

打赏
举报



<script type="text/javascript">

	var classList = [];

	$("*").each(function(idx){

		var curClass = $(this).attr('class');

		if(typeof(curClass) != 'undefined'){

			if(!(curClass in classList)){

				classList[classList.length] = curClass;

			}

		}

	});



	alert(classList);

</script>

neongeo 2010-01-03

打赏
举报

不懂jquery, 用javascript来积分

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<body>
<div class="page">
<div class="head">
<div class="line">
<div class="mod logo" >
<div class="inner">
<div class="hd ">
<h3>logo</h3>
</div>
<div class="bd li li_24 li_h24">
<ul>
<li><a href="#">测试</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="line"></div>
<div class="line"></div>
</div>
<div class="body">
.....
</div>
<div class="foot">
.....
</div>
</div>

<script language="javascript">
Array.prototype.unique =
function() {
var a = [];
var l = this.length;
for(var i=0; i<l; i++) {
for(var j=i+1; j<l; j++) {
// If this[i] is found later in the array
if (this[i] === this[j])
j = ++i;
}
a.push(this[i]);
}
return a;
};

var divs = document.getElementsByTagName("div");
var classname_str = "";
for( i in divs){
classname_str += divs.item(i).className + " ";
}
classname_str = classname_str.replace("/\s\s+/", " ");
var classname_array = classname_str.split(" ");
classname_array.splice(classname_array.length -1, 1);
alert(classname_array.unique())

</script>
</body>
</html>

xmliy 2010-01-03

打赏
举报



var css_sheet = [];

$('.page *').each(function() {

    if (this.className != '') css_sheet.push(this.className);

});

zhyzdl 2010-01-03

打赏
举报

study

举例浅谈JQuery中$('.classname').get(0); $('.classname').eq(0); $('.classname')[0]三者的区别 demo Dom结构： 1 2 3 分析①：JQuery代码： $(function () {

用JQuery做一个简单的下拉列表 1、以下是效果图 2、下面是css样式 <style> * { margin: 0; padding: 0; } ul { list-style: none; } .biao { width: 330px; height: 30px; margin: 10...

layui和jquery中加载出来的按钮出现重复加载jQuery 中(′.classname′).on(′click′,function());与('.classname').on('click',function(){});与(′.classname′).on(′click′,function());与(document).on('click','.classname',function(){});解决方法 jQuery 中(′.classname′).on(′click′,function());与('

常用方法（Common Method）与class有关的方法 addClass(className)//为该Jquery指定或增加一个className，返回该JqueryremoveClass(className)//移除参数指定的className，返回该JqueryhasClass(className)//测试该Jquery是否含有参数指定的classNametoggleClass...

发帖

JavaScript

8.7w+

社区成员

22.4w+

社区内容

Web 开发 JavaScript

社区管理员

加入社区

帖子事件

创建了帖子

2010-01-03 11:09

社区公告

暂无公告