Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.09.2017, 13:18
Новичок на форуме
Отправить личное сообщение для js-is-gay Посмотреть профиль Найти все сообщения от js-is-gay
 
Регистрация: 06.09.2017
Сообщений: 4

Как бы вы переписали эту функцию
function createElement(tag, attrs = {}, ...children) {
  const elem = document.createElement(tag);
  for (let [k, v] of Object.entries(attrs)) {
    if (k.startsWith('on')) {
      elem.addEventListener(k.slice(2), v);
    } else {
      elem.setAttribute(k, v);
    }
  }
  for (let child of children) {
    elem.appendChild((child instanceof HTMLElement) ? child : document.createTextNode(child));
  }
  return elem;
}
Ответить с цитированием
  #2 (permalink)  
Старый 06.09.2017, 13:25
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

А что с ней не так?
Ответить с цитированием
  #3 (permalink)  
Старый 06.09.2017, 14:11
Новичок на форуме
Отправить личное сообщение для js-is-gay Посмотреть профиль Найти все сообщения от js-is-gay
 
Регистрация: 06.09.2017
Сообщений: 4

я в постоянных поисках совершенства:

Ответить с цитированием
  #4 (permalink)  
Старый 06.09.2017, 14:56
Новичок на форуме
Отправить личное сообщение для js-is-gay Посмотреть профиль Найти все сообщения от js-is-gay
 
Регистрация: 06.09.2017
Сообщений: 4

Какие доводы против того чтобы аттрибуты передавались вторым аргументом?

'use strict';

const $ = (selector, node = document) => node.querySelector(selector);
const $$ = (selector, node = document) => [...node.querySelectorAll(selector)];

function createElement(tag, content, attrs) {
  const elem = document.createElement(tag);
  if (Object.prototype.toString.call(content) === '[object Object]') {
    [content, attrs] = [attrs, content];
  }
  if (attrs !== null && typeof attrs !== 'undefined') {
    for (let [k, v] of Object.entries(attrs)) {
      if (k.startsWith('on')) {
        elem.addEventListener(k.slice(2), v);
      } else {
        elem.setAttribute(k, v);
      }
    }
  }
  if (content !== null && typeof content !== 'undefined') {
    if (Array.isArray(content)) {
      for (let v of content) {
        addContent(elem, v);
      }
    } else {
      addContent(elem, content);
    }
  }
  return elem;
}

function addContent(element, content) {
  if (content instanceof HTMLElement || content instanceof Text) {
    element.appendChild(content);
  } else {
    element.appendChild(new Text(content));
  }
}

const htmlTags = 'a|abbr|address|area|article|aside|audio|b|base|bdi|bdo|blockquote|body|br|button|canvas|caption|cite|code|col|colgroup|data|datalist|dd|del|details|dfn|dialog|div|dl|dt|em|embed|fieldset|figcaption|figure|footer|form|h1|h2|h3|h4|h5|h6|head|header|hgroup|hr|html|i|iframe|img|input|ins|kbd|keygen|label|legend|li|link|main|map|mark|menu|menuitem|meta|meter|nav|noscript|object|ol|optgroup|option|output|p|param|pre|progress|q|rb|rp|rt|rtc|ruby|s|samp|script|section|select|small|source|span|strong|style|sub|summary|sup|table|tbody|td|template|textarea|tfoot|th|thead|time|title|tr|track|u|ul|var|video|wbr'.split('|');
for (let tag of htmlTags) {
  window['$' + tag] = createElement.bind(null, tag);
}


Пример:

$a($b('GOOGLE'), { href: 'http://www.google.com/' }).outerHTML
"<a href="http://www.google.com/"><b>GOOGLE</b></a>"
// Можно в любом порядке передавать аргументы
$a({ href: 'http://www.google.com/' }, $b('GOOGLE')).outerHTML

Последний раз редактировалось js-is-gay, 07.09.2017 в 13:12.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Управление скроллом "а-ля тач" HonesT Элементы интерфейса 2 27.08.2013 14:25
Как назвать функцию? mrtarantul Оффтопик 12 10.08.2013 16:26
Flot Как передать переменную в функцию отрисовки точки на графике Ren jQuery 0 20.06.2012 14:16
Как вызвать функцию из другого файла Mukhtar AJAX и COMET 4 07.10.2011 22:01
[Closure Compiler] Как запретить инлайнить функцию, которая вызывается из setTimeout? xintrea Events/DOM/Window 4 11.02.2011 16:23