Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   даже не знаю как назвать топик, но во внутрь загляните (https://javascript.ru/forum/events/51544-dazhe-ne-znayu-kak-nazvat-topik-no-vo-vnutr-zaglyanite.html)

Tecvid 10.11.2014 17:30
даже не знаю как назвать топик, но во внутрь загляните
 
я тут набросал кое-что для себя, дабы быстрее работал приложение, но стоит ли в плане кроссбраузерности (в том числе и поддержка старых версий браузеров, кроме осла), или всё же лучше пользоваться jQuery?

// Selecting
function sel(selector) {
    return document.querySelector(selector);
}
    
// Attributes manipulating
function attr(selector, attribute, value) {
    var al = arguments.length;
      
    if (al == 2) {
        return sel(selector).getAttribute(attribute);
    } else if (al == 3) {
        return sel(selector).setAttribute(attribute, value);
    }
}

devote 10.11.2014 17:42
Цитата:
Сообщение от Tecvid
document.querySelector(selector)
может вернуть null если элемент не нашел... а отсюда будет ошибка в функции attr()

Tecvid 10.11.2014 17:47
Цитата:
Сообщение от devote
может вернуть null если элемент не нашел... а отсюда будет ошибка в функции attr()
благодарю, учту это, хотя я этим буду пользоваться я и не собираюсь впихнуть то что он может не найти :)
ну а как насчёт кроссбраузерности ?)

devote 10.11.2014 17:55
Цитата:
Сообщение от Tecvid
ну а как насчёт кроссбраузерности ?)
ну работать должно везде и в осле тоже, начиная с версии ИЕ8+, хотя в ИЕ8 некоторые селекторы отсутствуют. Но они редко нужны. В остальном все норм.

Tecvid 10.11.2014 18:02
Цитата:
Сообщение от devote
ну работать должно везде и в осле тоже, начиная с версии ИЕ8+, хотя в ИЕ8 некоторые селекторы отсутствуют. Но они редко нужны. В остальном все норм.
ага понятно) спасибо большое, теперь могу спокойно спать по ночам что всё везде одинаково :)

рони 10.11.2014 18:29
Tecvid,
зачем if (al == 3) ?

krutoy 10.11.2014 18:31
Tecvid,
Цитата:
Сообщение от Tecvid
function sel(selector) {
return document.querySelector(selector);
}
а так:
sel=document.querySelector

Не работает?

Tecvid 10.11.2014 18:38
Цитата:
Сообщение от рони
зачем if (al == 3) ?
то есть если аргументов 3, если не верно, то скажите как будет верно :)

Цитата:
Сообщение от krutoy
а так:
sel=document.querySelector

Не работает?
даже не пробовал) раз работает то буду так :)
это просто привычка от php, пока не совсем вник в локаничность написанию в функции, объекты и т д в js)) тьфу, сам не понял что сказал :D

krutoy 10.11.2014 18:42
Цитата:
Сообщение от Tecvid
function attr(selector, attribute, value) {
var al = arguments.length;

if (al == 2) {
return sel(selector).getAttribute(attribute);
} else if (al == 3) {
return sel(selector).setAttribute(attribute, value);
}
}
Это можно было бы сократить нмного
function attr(selector, attribute, value) {
    if (!value) return sel(selector).getAttribute(atribute)
    return sel(selector).setAttribute(attribute, value);
}

Tecvid 10.11.2014 18:44
Цитата:
Сообщение от krutoy
Это можно было бы сократить нмного
благодарю, действительно значительно сократилось

рони 10.11.2014 18:50
krutoy,
как в атрибут установить "" ?

рони 10.11.2014 18:53
Tecvid,
function attr(selector, attribute, value) {
    if ( arguments.length == 2) return sel(selector).getAttribute(atribute);
    return sel(selector).setAttribute(attribute, value);
}

krutoy 10.11.2014 18:55
Цитата:
Сообщение от Tecvid
даже не пробовал) раз работает то буду так
Прошу прощения, я не проверял, сам, просто поинтересовался. Проверил сейчас -- не работает :)

Вот так должно работать 
sel=document.querySelector.bind(document)

Хотя, не важно, ваш вариант не хуже:) Это чисто исследовательский интерес:)

Tecvid 10.11.2014 18:56
Цитата:
Сообщение от рони (Сообщение 340255)
Tecvid,
function attr(selector, attribute, value) {
    if ( arguments.length == 2) return sel(selector).getAttribute(atribute);
    return sel(selector).setAttribute(attribute, value);
}
спасибо большое профессор рони ;)

krutoy 10.11.2014 18:58
Цитата:
Сообщение от рони
как в атрибут установить "" ?
А когда это может потребоваться? Кстати, там последний ретурн тоже не нужен. Нам же возвращать ничего не надо.

Tecvid 10.11.2014 18:59
Цитата:
Сообщение от krutoy (Сообщение 340256)
Прошу прощения, я не проверял, сам, просто поинтересовался. Проверил сейчас -- не работает :)
:D ничего страшного)

Вот так должно работать 
sel=document.querySelector.bind(document)

Хотя, не важно, ваш вариант не хуже:) Это чисто исследовательский интерес:)[/quote]
я лучше обойдусь без лиших глобальных переменных ;) но ваш вариант думаю лучше относительно удобства дальнейшего его использрвания :)

Tecvid 10.11.2014 19:07
проверил, но ваши варианты с attr() не сработали :) можете сами проверить)

update: прошу прощения, ошибка была в другом месте, а не из-за изменения функция на ваш

krutoy 10.11.2014 19:09
Цитата:
Сообщение от Tecvid
проверил, но ваши варианты с attr() не сработали можете сами проверить)
там грамматическая ошибка была
atribute/attribute

krutoy 10.11.2014 19:12
Tecvid,
<!DOCTYPE html>
<html>
<head>
  <meta charset="windows-1251">
  <title>foo</title>
  <style>
  </style>
</head>
<body>

<p id="foo" mmm="nnn">foo</p>
<p id="bar" mmm="nnn">bar</p>

<script>

sel=document.querySelector.bind(document)
function attr(selector, attribute, value) {
    if (!value) return sel(selector).getAttribute(attribute)
    sel(selector).setAttribute(attribute, value);
}

console.log(attr("#foo", "mmm"))
console.log(attr("#bar", "mmm"))
attr("#foo", "mmm", "111" )
console.log(attr("#foo", "mmm"))

</script>
</body>
</html>

Tecvid 10.11.2014 19:15
Цитата:
Сообщение от krutoy (Сообщение 340264)
Tecvid,
<!DOCTYPE html>
<html>
<head>
  <meta charset="windows-1251">
  <title>foo</title>
  <style>
  </style>
</head>
<body>

<p id="foo" mmm="nnn">foo</p>
<p id="bar" mmm="nnn">bar</p>

<script>

sel=document.querySelector.bind(document)
function attr(selector, attribute, value) {
    if (!value) return sel(selector).getAttribute(attribute)
    sel(selector).setAttribute(attribute, value);
}

console.log(attr("#foo", "mmm"))
console.log(attr("#bar", "mmm"))
attr("#foo", "mmm", "111" )
console.log(attr("#foo", "mmm"))

</script>
</body>
</html>
работает) спасибо

devote 10.11.2014 19:19
Цитата:
Сообщение от krutoy
Это можно было бы сократить нмного
Для этого есть минификаторы. Делать код в одну строчку, это не код а говнокод
Цитата:
Сообщение от krutoy
sel=document.querySelector.bind(document)
Метода .bind () нету в ИЕ8

krutoy 10.11.2014 19:19
Tecvid,
Но вообще, да, ронни прав, если надо выставить атрибут в значение пустой строки, мой вариант не сработает, я правда не знаю, зачем это нужно:)

Tecvid 10.11.2014 19:27
Цитата:
Сообщение от krutoy
если надо выставить атрибут в значение пустой строки, мой вариант не сработает
а вообще-то можно и это тоже проверить в условии, тем самым усложнив функцию, в теории звучит хорошо но на практике мне пока не нужна)) но возьму на заметку ;)

короче, всем большое спасибо :) очень признателен)

рони 10.11.2014 19:36
Цитата:
Сообщение от krutoy
я правда не знаю, зачем это нужно
сбросить атрибут в значение по умолчанию

krutoy 10.11.2014 19:41
Цитата:
Сообщение от рони
сбросить атрибут в значение по умолчанию
Можно сбросить во что угодно, он все равно не сработает. Зачем все усложнять.

devote 10.11.2014 19:48 
function attr(selector, attrName, attrValue) {
  if (arguments.length > 2) {
    if (attrValue === null) {
      // удаляет атрибут
      return sel(selector).removeAttribute(attrName);
    }
    // задает значение атрибуту
    return sel(selector).setAttribute(attrName, attrValue);
  }
  // возвращает значение атрибута
  return sel(selector).getAttrubute(attrName);
}

krutoy 10.11.2014 19:50
рони,
В любом случае, проблема не велика, это пустое все, как выше заметил Tecvid

if(value||value==="") reurn ...
...
, делов то.:)

Tecvid 10.11.2014 20:06
Цитата:
Сообщение от devote (Сообщение 340275) 
function attr(selector, attrName, attrValue) {
  if (arguments.length > 2) {
    if (attrValue === null) {
      // удаляет атрибут
      return sel(selector).removeAttribute(attrName);
    }
    // задает значение атрибуту
    return sel(selector).setAttribute(attrName, attrValue);
  }
  // возвращает значение атрибута
  return sel(selector).getAttrubute(attrName);
}
спасибо огромное, вот это уже функция)
хотя странно что в первоначальной функции setAttribute работал и без return, а тут нет)

devote 10.11.2014 20:10
Цитата:
Сообщение от Tecvid
в первоначальной функции setAttribute работал и без return, а тут нет)
ну можно убрать ретурны:
function attr(selector, attrName, attrValue) {
  if (arguments.length > 2) {
    if (attrValue === null) {
      // удаляет атрибут
      sel(selector).removeAttribute(attrName);
    } else {
      // задает значение атрибуту
      sel(selector).setAttribute(attrName, attrValue);
    }
  } else {
    // возвращает значение атрибута
    return sel(selector).getAttrubute(attrName);
  }
}

Tecvid 10.11.2014 20:39
Цитата:
Сообщение от devote
ну можно убрать ретурны:
когда их убираю не срабатывает) поэтому сказал что странно :)

krutoy 10.11.2014 20:43
Tecvid,
ретурн -- это выход из ф-ции. То есть, если ты пишешь
f=function(){
if (foo) return bar
baz
}

То baz не отработает. Поэтому не везде их можно убирать.

Tecvid 10.11.2014 20:49
Цитата:
Сообщение от krutoy (Сообщение 340295)
Tecvid,
ретурн -- это выход из ф-ции. То есть, если ты пишешь
f=function(){
if (foo) return bar
baz
}

То baz не отработает. Поэтому не везде их можно убирать.
это я понимаю, но не могу понять почему в случае проверки value === null без return не обходится, а вот без этой проверки с ней обходится) хотя по сути одно и та же функция, но допиленная чуточку) странно

krutoy 10.11.2014 21:19
Tecvid, если я правильно понял
sel=document.querySelector.bind(document)
function attr(selector, attrName, attrValue) {
  if (arguments.length > 2) {
    if (attrValue === null) {
      // удаляет атрибут
      return sel(selector).removeAttribute(attrName);
    }
    // задает значение атрибуту
    sel(selector).setAttribute(attrName, attrValue);// Выходим из ифа
  }
  // возвращает значение атрибута
  return sel(selector).getAttrubute(attrName);// синтаксическая ошибка getAttrUbute, но, сюда мы вообще не должны были ходить, поэтому return убирать там нельзя было
}

Tecvid 10.11.2014 21:30
Цитата:
Сообщение от krutoy (Сообщение 340301)
Tecvid, если я правильно понял
sel=document.querySelector.bind(document)
function attr(selector, attrName, attrValue) {
  if (arguments.length > 2) {
    if (attrValue === null) {
      // удаляет атрибут
      return sel(selector).removeAttribute(attrName);
    }
    // задает значение атрибуту
    sel(selector).setAttribute(attrName, attrValue);// Выходим из ифа
  }
  // возвращает значение атрибута
  return sel(selector).getAttrubute(attrName);// синтаксическая ошибка getAttrUbute, но, сюда мы вообще не должны были ходить, поэтому return убирать там нельзя было
}
хмм я даж не заметил эту ошибку, оказывается вся тайна скрывалась в ней

kostyanet 11.11.2014 15:52
attr(selector, attribute, value)

И в чем тут цимес?

attr(some_element,'data-huy-znaet-chto','Hello Word');
some_element.setAttribute('data-huy-znaet-chto','Hello Word');


На дохуя короче? Скаляры все равно кавычить.


Часовой пояс GMT +3, время: 17:40.