简体   繁体   English

按类名查找元素

[英]find elements by classname

i have the following question: 我有以下问题:

in my body i hav this div construction: 在我的体内,我有这个div结构:

<div id="page-wrapper">
    <div id="page">
        <div id="page-content" class="page-inner">
            <div id="page-content-inner">
                <div class="box tagcloud">
                    <div class="modulcontent">
                        <div class="tagspopular tagcloud tagscloud tagcloud">
                            <span class="tag" >
                                <a class="tag-name" > test1</a>
                            </span>
                            <span class="tag">
                                <a class="tag-name" >test2</a>
                            </span>
                            <span class="tag">
                                <a class="tag-name" >test3</a>
                            </span>
                            <span class="tag">
                                <a class="tag-name" > test4</a>
                            </span>
                            <span class="tag">
                                <a class="tag-name" >test5</a>
                            </span>
                            <span class="tag">
                                <a class="tag-name" >test6</a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

I know want to select the spans with the "tag"-class with javascript. 我知道要使用javascript选择“标签”类的跨度。

I first tried normal javascript: 我首先尝试了普通的javascript:

var elementArray;

elementArray = document.getElementsByClassName("tag");

for(var i = 0; i < elementArray.length; i++) {
    console.log(elementArray[i].className);
} 

But there is nothing in the protocol http://jsfiddle.net/42RJD/2/ 但是协议http://jsfiddle.net/42RJD/2/中没有任何内容

Then i tried with jquery: 然后我尝试用jQuery:

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery-noconflict.js" type="text/javascript"></script>
<script src="jquery-migrate.js" type="text/javascript"></script>

<script type="text/javascript">
    var pre = $('.tag');

    pre.each(function(i, el){
        console.log( el );
        // OR
        console.log( this ); // will give you the element

        // suppose to get text
        console.log( $(el).text() ); // or $(this).text()
    });
</script> 

When i tried this, i got a Error: TypeError: $ is not a function var pre = $('.tag'); 当我尝试这样做时,出现错误: TypeError: $ is not a function var pre = $('.tag');

http://jsfiddle.net/42RJD/3/ http://jsfiddle.net/42RJD/3/

I actual don't know what to do. 我实际上不知道该怎么办。 I get both codes from here but it still dont work. 我从这里得到两个代码,但仍然无法正常工作。 :( :(

You should use .ready() to execute the code when the DOM is fully loaded. DOM完全加载后,应使用.ready()执行代码。

$( document ).ready(function() {

    var pre = $('.tag');

    pre.each(function(i, el){
        console.log( el );
        // OR
        console.log( this ); // will give you the element

        // suppose to get text
        console.log( $(el).text() ); // or $(this).text()
    });

});

http://api.jquery.com/ready/ http://api.jquery.com/ready/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM