Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.11.2013, 11:50
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

спрятать/объект + css
В JQuery я умею делать кое-какие действия. А как это делать в JS?

1) Как с JS спрятать/показать элемент документа?
2) Как добавить элементу новое CSS-свойство?

Спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 07.11.2013, 12:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Faab,
Эта глава — о свойствах стиля, получении о них информации и изменении при помощи JavaScript
Ответить с цитированием
  #3 (permalink)  
Старый 07.11.2013, 12:53
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Сообщение от рони Посмотреть сообщение
Faab,
Эта глава — о свойствах стиля, получении о них информации и изменении при помощи JavaScript
Спасибо. Именно то что хотел узнать.

У меня есть такие элементы.

<style type="text/css" media="screen">
.disNone {
  display: none;
}
</style>
<script>
window.onload = function(){
  var eMainButton = document.getElementById('hoofdknop'); 
  eMainButton.onclick = function(){
    var eDivImages = document.querySelectorAll('.toogle');
    //var sClassList = 
    eDivImages.classList.add('disNone');
    //alert(sClassList);
  }; 
};
</script>

   <button id="hoofdknop">Alle schermen verbergen</button>
   <dd>de Wizard Site definition verschijnt, je beantwoordt een aantal vragen
      <div class="toggle"><img class="screenshot" width="238" height="222" src="../images/clip_image014.gif" alt="schermafdruk"> </div>
    </dd>
    <dt> &ldquo;Hoe wil u de website noemen?&rdquo; </dt>
    <dd>vul in <i> George&rsquo;s site</i>
      <div class="toggle"><img class="screenshot" width="310" height="307" src="../images/clip_image002.gif" alt="schermafdruk"> </div>
    </dd>


Выходит ошибка: TypeError: eDivImages.classList is undefined
eDivImages при контрольном выводе выдаёт Object NodeList

Последний раз редактировалось Faab, 07.11.2013 в 12:58.
Ответить с цитированием
  #4 (permalink)  
Старый 07.11.2013, 13:05
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Faab,
каждому елементу eDivImages надо присвоить класс а не всем хором
Ответить с цитированием
  #5 (permalink)  
Старый 07.11.2013, 13:13
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Перебрать в цикле?
Ответить с цитированием
  #6 (permalink)  
Старый 07.11.2013, 13:22
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Сообщение от Faab
Перебрать в цикле?
да
Ответить с цитированием
  #7 (permalink)  
Старый 07.11.2013, 14:45
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

var eSubButton = document.createElement('input');
eSubButton.type = "button";
eSubButton.value = "Behind";
var eDivTootgle = document.querySelectorAll('.toggle'); // toggle
  // alert(eDivTootgle.length);
var i = 0;
for(i=0; i<eDivTootgle.length; i++){
    eDivTootgle[i].appendChild(eSubButton);
};


Так элемент кнопка добавляется только к последнему диву, а мне надо к каждому. Нужно кажый раз создавать новую кнопку или клонировать объект? Как лучше?

var i = 0; перед циклом нужна или нет?
Ответить с цитированием
  #8 (permalink)  
Старый 07.11.2013, 14:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Сообщение от Faab
Нужно кажый раз создавать новую кнопку или клонировать объект? Как лучше?
да и оба варианта приемлимы, как вам удобнее
Ответить с цитированием
  #9 (permalink)  
Старый 07.11.2013, 15:27
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Сообщение от Faab
В JQuery я умею делать кое-какие действия. А как это делать в JS?
Возможно, эта статья будет тоже полезна:
Нативные эквиваленты функций jQuery
Ответить с цитированием
  #10 (permalink)  
Старый 07.11.2013, 16:14
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Что то я понимаю. Приведу сначало весь скрипт, а потом вопросы.

function createButton(){
    var eSubButton1;
    eSubButton1 = document.createElement('input');
    eSubButton1.type = "button";
    eSubButton1.value = "Behind";
    return eSubButton1;
  };
  
  var eArticle, eImages, eImage, sClassList, eSubButton;
  var eMainButton = document.getElementById('hoofdknop');

  var eDivTootgle = document.querySelectorAll('.toggle'); // toggle
  // alert(eDivTootgle.length);

  for(i=0; i<eDivTootgle.length; i++){
    eSubButton = createButton();
    eDivTootgle[i].appendChild(eSubButton);
  }; //parentNode
  
  eSubButton.onclick = function(){
    // alert(eSubButton.value);
  };




Когда кнопки добавились, мне надо что бы при нажатии на одну из этих кнопок, я выделял ео родителя. Но как? Выделить все кнопки (например через getElementsByTagName) и и на всю коллекцию поставить событие? В JQ такой принцип работы вроде.


Сообщение от BETEPAH Посмотреть сообщение
Возможно, эта статья будет тоже полезна:
Нативные эквиваленты функций jQuery
спасибо

Последний раз редактировалось Faab, 07.11.2013 в 17:10.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подключение css bartle96 Элементы интерфейса 13 27.07.2013 19:03
Смена css стилей stvord Элементы интерфейса 5 03.09.2011 21:10
JQuery CSS анализатор javascript jQuery 2 15.08.2010 21:27
если (свойство css == 2) свойство css = 1; funkypublic Events/DOM/Window 1 09.06.2010 17:39
Подскажите по CSS меню Александр_1988 Элементы интерфейса 1 17.05.2010 11:58