Программный доступ к атрибутам HTML с помощью Javascript

Question

Я использую пользовательский TimeSelector, который я размещаю на странице в HTML следующим образом:

   <MKB:TimeSelector DisplaySeconds="false" ID="endTimeSelector" runat="server" Visible="True" Date="5:30 PM" />

В функции Javascript я хотел бы обновить атрибут Date.Я пробовал эти (которые не работают):

   var sel = document.getElementById("endTimeSelector");
   sel.Date="6:30 PM";
   sel.setAttribute("Date","6:30 PM");

Так как это пользовательский селектор, я не ожидаю ответа, специфичного для этого компонента.Я думаю, я просто спрашиваю, есть ли общее решение для обновления атрибутов HTML из Javascript (без предварительного доступа к серверу).

РЕДАКТИРОВАТЬ: Хорошо, поэтому причина в том, что это не работает, что это не реальноID из-за ASP.Действительно, вот настоящий HTML:

<span id="endTimeSelector"><table CellSpacing="0" CellPadding="0" style="border-collapse:collapse;border-style:None;border-width:0px;">
                <tr>
                    <td style="vertical-align:Bottom;"><input id="endTimeSelector_txtHour" name="endTimeSelector" onclick="this.select();lastFocusCtrl=this;" onchange="intOnly(this,12);" onFocus="this.select();lastFocusCtrl=this;" onKeyDown="return updownArrow(event, this,12,15,1);" cols="2" maxlength="2" value="05" style="height:15px;border-bottom:solid 1px Silver;border-left:solid 1px Silver;border-top:solid 1px Silver;background-color:;border-right:none;width:17px;font-size:9pt;" /><input readonly="readonly" cols="1" maxlength="1" value=":" onclick="this.nextSibling.focus();//this.blur();return false;" onfocus="this.nextSibling.focus();//blur();return false;" style="height:15px;border-bottom:solid 1px Silver;border-left:none;border-right:none;border-top:solid 1px Silver;background-color:;font-size:9pt;width:4px;" /><input id="endTimeSelector_txtMinute" name="endTimeSelector_txtMinute" onclick="this.select();lastFocusCtrl=this;" onchange="intOnly(this,12);" onFocus="this.select();lastFocusCtrl=this;" onKeyDown="return updownArrow(event, this,12,15,1);" cols="2" maxlength="2" value="30" style="height:15px;border-bottom:solid 1px Silver;border-left:none;border-top:solid 1px Silver;background-color:;border-right:none;width:17px;font-size:9pt;" /><input id="endTimeSelector_txtAmPm" name="endTimeSelector_txtAmPm" readonly="readonly" onclick="this.select();lastFocusCtrl=this;" onchange="keepAmPm();" onFocus="this.select();lastFocusCtrl=this;" onKeyDown="return updownArrow(event, this,12,15,1);" cols="2" maxlength="2" value="PM" style="height:15px;border-bottom:solid 1px Silver;border-left:none;border-right:solid 1px Silver;border-top:solid 1px Silver;background-color:;width:22px;font-size:9pt;" /></td><td><img id="endTimeSelector_imgUp" onclick="addTime(this,12,15,1);" src="/WebResource.axd?d=tiVFNiu7HJgIVjO35sllj-s8Z6xcGnuxvWjcv0djLK_ZmlnEvSWKeuPozcoAJ1jdWjt3Em28mdAuVmJ3sjSDr9LkBqj6QzQZ5DI3R2uqFhoN8cDn0&amp;t=634103086365158927" onMouseOver="this.src='/WebResource.axd?d=Qwp1CEy_uAYBRj85nDAQgbZhe_gPeEn6uH400SE9Ka9Ba6-0jO725XcMqD-0COZumHZlpEmorXnDALAg08OiLidM1LQwMWqOZjS8k7tAw7ECNag4Bf2m7vLYgXi_qGcGiYyX_A2&amp;t=634103086365158927';" onMouseOut="this.src='/WebResource.axd?d=tiVFNiu7HJgIVjO35sllj-s8Z6xcGnuxvWjcv0djLK_ZmlnEvSWKeuPozcoAJ1jdWjt3Em28mdAuVmJ3sjSDr9LkBqj6QzQZ5DI3R2uqFhoN8cDn0&amp;t=634103086365158927';" style="cursor:pointer;" /><br /><img id="endTimeSelector_imgDown" onclick="subtractTime(this,12,15,1);" src="/WebResource.axd?d=RVSDbruLRZ0XghTuQh3hchhyT2e1a6SFSCXTFMsJE6ux0Q-eu595sEnqVZjLRVJIk8d1eraE2M2gVUNfg53pgpfVC5Zpok9BfW7SZbqS5Cw5--R20&amp;t=634103086365158927" onMouseOver="this.src='/WebResource.axd?d=AKuxDQkfX9IrXbNQV4GNdTNCDKooNjlZXtJpRgDvjUm7-6FL0ZGTizlx50cTntULqw3ZuEaV7CYV4hWPZa9ZdVWCsPfPrSyKMGJNDRWsBYHpdYUH1HrLPbbaesYkf-cDXlZ_-w2&amp;t=634103086365158927';" onMouseOut="this.src='/WebResource.axd?d=RVSDbruLRZ0XghTuQh3hchhyT2e1a6SFSCXTFMsJE6ux0Q-eu595sEnqVZjLRVJIk8d1eraE2M2gVUNfg53pgpfVC5Zpok9BfW7SZbqS5Cw5--R20&amp;t=634103086365158927';" style="cursor:pointer;" /></td>

                </tr>
            </table></span>

Yikes, это безобразно.Больше нет атрибута с именем «Дата».

Редактировать 2: Значит ли это, что невозможно напрямую обновить атрибут даты?

Что если я сделаю что-то вроде установки Date в значение какой-либо переменной и обновлю переменную?

Answer 1

Проверьте свойство Control.ClientID .

Эта строка:

var sel = document.getElementById("endTimeSelector");

должно быть:

var sel = document.getElementById("<%= endTimeSelector.ClientID %>");

Это классическая ошибка в том, что то, что у вас есть , не является HTML , это просто синтаксис, при котором ASP.NET преобразуется в HTML и при этом изменяет идентификатор элемента управления . Проверьте использование HTML, просмотрев источник в своем браузере - я думаю, вы обнаружите, что он сильно отличается от того, что вы написали!

Answer 2

, чтобы сделать это, вы должны получить доступ к самому элементу управления html внутри своего пользовательского элемента управления.попробуйте получить элемент управления html, затем установите его значение на нужное вам значение. Вы можете сделать это с помощью jquery следующим образом:

$('#HTMLControlID').attr('attributeName','value');

или

$('#HTMLControlID').prop('attributeName','value'); //jquery 1.6