Блог

У меня HTML структурирован следующим образом:

 <li class="mktFormReq mktField">
    <label>Industry</label>
    <span class="mktInput">
        <div class="jqTransformSelectWrapper" style="z-index: 9; width: 210px;">
            <div>
                <span style="width: 154px;">Consumer Packaged Goods</span>
                <a href="#" class="jqTransformSelectOpen"></a>
            </div>
            <ul style="width: 208px; display: none; visibility: visible;">
                <li style="">
                    <a href="#" index="0" class="">Industry*</a>
                </li>
                <li>
                    <a href="#" index="1">Business Services</a>
                </li>
                <li>
                    <a href="#" index="2" class="selected">Consumer Packaged Goods</a>
                </li>
                <li>
                    <a href="#" index="3">Energy</a>
                </li>
            </ul>
            <select class="mktFormSelect mktFReq jqTransformHidden required" name="Download_Industry__c" id="Download_Industry__c" size="1" tabindex="8" style="">
                <option value="" selected="selected">Industry*</option>
                <option value="Business Services">Business Services</option>
                <option value="Consumer Packaged Goods">Consumer Packaged Goods</option>
                <option value="Energy">Energy</option>
            </select>
        </div>
        <span class="mktFormMsg"></span>
    </span>
</li>
  

Здесь я должен выбрать значение в диапазоне первого div с помощью jQuery. Но при использовании атрибута name или id select элемента, т. Е. При использовании #Download_Industry__c , я должен выбрать значение «Потребительские упакованные товары» (вверху span с style атрибутом).

Мой подход заключается в том, чтобы выбрать родительский узел select , затем выбрать первый дочерний узел, а затем продолжить. Но я не могу написать для него синтаксис. Я пробовал этот способ:

 $('#Download_Country__c').parent().first().html();
  

Но это не работает.

Перейдите к родительскому узлу, затем find к span нужному:

 $("#Download_Country__c").parent().find("div > span");
  

Вы также можете использовать siblings :

 $("#Download_Country__c").siblings(":first-child").find("span");
  

В настоящее время вы выбираете только родительский узел. ( $('#Download_Country__c').parent().first().html(); то же $('#Download_Country__c').parent().html(); самое, что и)

Попробуйте это для получения первых дочерних узлов:

 $('#Download_Country__c').parent().children().first().html();