VDS за 300р от нашего партнера SpaceWeb
[8]
27 Дек 2011, 10:08

Вопросы по javascript

Здравствуйте. У меня есть несколько вопросов ответы на которые я пока не нашел в сети, может тут мне помогут избавиться от сомнений?

1. Можно ли давать переменным названия html тегов? Например код:

var table = document.createElement('table'); var thead = document.createElement('thead'); var tbody = document.createElement('tbody'); ...

В принципе ошибки не возникает и скрипт работает, но меня беспокоит правильность вообще такого написания, может из-за этого возникнуть какая нибудь ошибка в дальнейшем?

2. Видел в некоторых скриптах такой формат записи:

... function example(){ var object = document.getElementById('table'); object.status=true; ... }

или

... 
... fucntion example(object){ object.status=true; ... }

В 1 варианте переменной присваивается объект и она становиться тоже объектом и можно в дальнейшем ей присваивать новые свойства?
в 2 варианте в функцию передается ссылка на объект div и видимо в функции создают новое свойство этому объекту, правильно ли так?

Спасибо за ответы.

Комментарии (10)
fullzilla 27.12.2011 12:42

1. Можно. Если мне не изменяет память, то вы можете использовать имена переменных состоящие из латинских букв, цифр и символов _ и $. Имя переменной не может начинаться с цифры.
Также существуют зарезервированные слова, которые нельзя использовать в качестве имени переменной. Такие как например class, var, return, for, while. HTML теги к ним не относятся.

2. Метод document.getElementById возвращает ссылку на узел документа.

3. В данном случае оператор this возвращает ссылку узел документа.
+1
simple 27.12.2011 14:26

т.е по поводу пункта 2 и 3 можно так делать? присваивать переменной значение , а потом этой же переменной в дальнейшем присвоить новое свойство как в примере...типо
var a=0;
a.num=1; ???
0
simple 27.12.2011 14:40

Есть еще один вопрос, даже не вопрос, а проблема для меня. Выяснилось что CSS свойства типа border-radius и box-shadow очень сильно грузят процессор грузят так интересным образом...пример:

<div style="overflow:auto;width:350px;height:200px;border:1px solid #000;-webkit-border-radius:5px;-webkit-box-shadow:0px 0px 2px 0px #33548B;">
/*Тут к примеру лежит таблица с width=1000px, чтобы у div появился нижний скроллбар*/
</div>

Так вот при таких небольших размерах Div скролиться вполне нормально и обычно, но стоит только сделать этот div скажем на весь экран с width=100% и height=100% то скролл ится он уже с сильным запаздыванием и тормозами, к тому же нагрузка на процессор возрастает до 60% из-за какой то вообщем то простой с виду операции...но если убрать из свойств box-shadow то становиться все нормально. Так вот вопрос почему так происходит, ведь div стоит на месте не куда не перемещается почему так border-shadow влияет на него?

Браузер Chrome.
+3
grom 27.12.2011 15:01

var a=0;

Переменная «а» не является объектом object. Ей нельзя задавать свойства. Также в примерах из пунктов 2 и 3, переменная является объектом Node. Она содержит в себе ссылку на узел документа. И в данном случае мы задаёте не свойства, а атрибуты этому узлу. Не все атрибуты так можно задавать. Почитайте про DOM.

Про border-radius и border-shadow не знаю. Я в Chrome проверил, у меня не тормозила.
+1
zzoll 27.12.2011 15:27

Вы взорвали форум! =)

Хочу добавить, что всё сверху в принципе правильно. На самом деле это довольно широкая тема.

Например есть объект string есть объект number. У них есть свои свойства и методы.

var a = 'str';
alert(typeof(a)) // string

var b = 33;
alert(typeof(b)) // number

Самой переменной вы свойство задать не можете.

var с = 'ccc';
c.test = '111'
alert(c.test) // undefined

Но вы можете расширить объект string используя его свойство prototype. Читайте про свойство prototype. Тогда все строковые переменные будут иметь заданное вами свойство.

Вообще по этому вопросу можно книгу написать.
+1
grom 27.12.2011 15:42

Запутаем человека окончательно.

String.prototype.test = 'my_test_prop';

var a = 'str';
alert(typeof(a)) // string

alert(a.test) // my_test_prop

a.test = 'new_test_prop';

alert(a.test) // my_test_prop # значение не поменялось!

+2
simple 27.12.2011 22:27

Ладно черт с ними с переменными, буду писать по старинке..
Ребят помогите мне лучше с спрайтами. Мне нужно сделать для кнопок иконки, в роли кнопок у меня контейнеры div 80x30, иконки 10х10...делал спрайт с помощью вот этого генератора http://spritegen.website-performance.org/
Выдал он мне вот такое:

#container  {
background: url(csg-4efa0d55382e7.png) no-repeat top left;
}
.sprite-close-out{ background-position: 0 0; width: 11px; height: 10px; }
.sprite-close-over{ background-position: -12px 0; width: 11px; height: 10px; }
.sprite-expand-out{ background-position: -24px 0; width: 12px; height: 10px; }
.sprite-expand-over{ background-position: -37px 0; width: 12px; height: 10px; }
.sprite-turn-out{ background-position: -50px 0; width: 12px; height: 5px; }
.sprite-turn-over{ background-position: -63px 0; width: 12px; height: 5px; }

вообщем мне нужно чтобы иконки были по середине кнопок (div) а у меня что то никак не получается это сделать, ведь background-position уже занят в спрайтах...как тут поступать? help!
+3
fullzilla 27.12.2011 23:05

Пожалуйста, не пишите всё в водной теме. Тем самым вы поможете не только пользователям которые будут искать похожие вопросы, но и сайту в целом.

На счёт спрайта. Генераторы зло.

Эти классы sprite-close-out - это что? Где они применяются в HTML. Как это всё располагается.
+3
simple 27.12.2011 23:19

sprite-close-out это иконка должна показываться когда курсор мыши наезжает на кнопку "закрыть окно"... sprite-close-over соответсвтенно когда уходит с кнопки, остальные классы так же для двух кнопок, свернуть turn и развернуть expand в двух вариантах out и over

PS Хорошо по следующему вопросу открою новую тему )
PSS А если генераторы зло как ручками это делать не подскажешь?

...
<div class=sprite-turn-out  onclick="turn(this)">свернуть окно</div>//вместо текста должна быть иконка фоном
<div class=sprite-expand-out  onclick="expand(this)"> развернуть окно</div>
<div class=sprite-close-out  onclick="close(this)">закрыть окно</div>

+2
fullzilla 27.12.2011 23:52

Тогда, раз это иконка (div) 10х10 которая располагается в кнопке (div) 80х30. То сдвигайте иконку используя например margin или используйте position:relative и дальше top, left.

Без рабочего примера, это сложно решить, я например вообще не понимаю зачем вам кнопка 80 на 30 в которой иконка 10 на 10 в центе. Остальные тогда 70px кнопки куда деваются?
+3

Добавить комментарий

Войдите, чтобы написать о чем-нибудь...
Вход Регистрация
Web.onRails
Найди ответ на любой вопрос по Веб-разработке!
задать вопрос...
Вы можете разместить Рекламный пост самостоятельно, либо отправив контент по адресу admin@webonrails.ru→ Оплата здесь ←Неоплаченные посты удаляются.
Метки:
Лучшее
[52]
16 Окт 2011, 15:38
Вывести все элементы POST
[просмотров 36580]
[100]
19 Дек 2014, 16:16
User-agent для Internet Explorer 11
[просмотров 36054]
[1]
15 Апр 2021, 08:29
Переполнение памяти Nuxt.js
[просмотров 34850]
[74]
31 мая 2011, 11:48
Python проверка существования переменной
[просмотров 14502]
[125]
21 Июл 2011, 14:04
Python Imaging Library (PIL)
[просмотров 11807]
[4]
10 Окт 2018, 15:33
Как запретить просмотр сайта по IP?
[просмотров 10852]
[50]
31 Дек 2011, 14:57
Cron запускать раз в неделю
[просмотров 8951]

Вести с Хабра