Bitrix JS -Javascript-библиотека Bitrix Framework

BX.type.isNotEmptyString(str);

BX("elemId").innerHTML = 'texthtml'; //вариант 1
BX.adjust(BX("elemId"), {html: '<span>текст</span>'}); //вариант2

BX("elemId").value = 'value'; 

BX.cleanNode(BX("elemId"));

BX("elemId").setAttribute("src",pathSrc);
BX("elemId").getAttribute("src");

BX.addClass(BX("elemId"), 'className');
BX.removeClass(BX("elemId"), 'className');
BX.toggleClass(BX("elemId"), ["arrowUp", "arrowDown"]);
BX.hasClass(BX("elemId"), 'className');

BX.append(BX.create('span', {text: 'someText'}),BX('elemId'));

BX.remove(BX("elemId"));

BX.show(BX("elemId"));
BX.hide(BX("elemId"));

var fields = BX.findChild(BX(elemId), {class: 'className'}, true, true);
fields.forEach(function(element){
   console.log(element);
});

//jquery
$(document).ready(function(){
   $(document).on('click','.myClass',function(e){
       //тут обработчик
      e.preventDefault();
   });
});

//bx
BX.ready(function(){
   BX.bindDelegate(
      document.body, 'click', {className: 'myClass' },
      function(e){
         if(!e) {
            e = window.event;
         }
         //тут обработчик
         return BX.PreventDefault(e);
      }
   );
});

//php
CJSCore::Init(array("date"));

<input type="text" value="03.02.2015" name="date" onclick="BX.calendar({node: this, field: this, bTime: false});">

//php 
CJSCore::Init(array('masked_input'));

//js
var phoneVal =  BX('orderInputPhone').value; //в value номер, из предыдущего заказа, например
var phoneMasked = new BX.MaskedInput({
        mask: '+7 999 999 9999', // устанавливаем маску
        input: BX('orderInputPhone'),
        placeholder: '_' // символ замены +7 ___ ___ __ __
}); 
if(phoneVal != ''){   
       phoneVal = phoneVal.replace(/[^\d]/g,"").trim();  //убираем все нечисла
       phoneMasked.setValue(phoneVal.substring(phoneVal.length, (phoneVal.length-10))); // устанавливаем значение без первой 7
}

//проверка на валидность телефона
if($('#orderInputPhone').val() == "" || $('#orderInputPhone').val().indexOf('_')!=-1){         
   err = "Проверьте на корректность телефон.";
}

//php 
CJSCore::Init(array('ajax'));

//js
var postData = {               
  'sessid': BX.bitrix_sessid(),
  'site_id': BX.message('SITE_ID'),
  'action': 'add',
  'id': offersId,
  'quantity': 1,
};
BX.ajax({
   url: '/ajax/file.php',
   method: 'POST',
   data: postData,
   dataType: 'json',
   onsuccess: function(result){      
      
   },
   onfailure: function(result){
      
   } 
});

//file.php

define("STOP_STATISTICS", true);
if (array_key_exists('site_id', $_REQUEST) && is_string($_REQUEST['site_id'])){
   $siteId = $_REQUEST['site_id'];
   if($siteId !== '' && preg_match('/^[a-z0-9_]{2}$/i', $siteId) === 1){
      define('SITE_ID', $siteId);
   }
}

require_once($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");

//подключаем нужные модули
use Bitrix\Main\Loader,
   Bitrix\Main\Application,
   Bitrix\Currency,
   Bitrix\Sale\DiscountCouponsManager;

Loader::includeModule('iblock');
Loader::includeModule('sale');
Loader::includeModule('catalog');
CUtil::JSPostUnescape();

if (!check_bitrix_sessid() || $_SERVER["REQUEST_METHOD"] != "POST") return;

$arRes = array();

if (isset($_POST["action"]) && strlen($_POST["action"]) > 0){
   $arRes = 'hello world';
}
$APPLICATION->RestartBuffer();
header('Content-Type: application/json; charset='.LANG_CHARSET);   
echo CUtil::PhpToJSObject($arRes); 
//иногда коряво работает можно использовать, смотрите консоль
//echo json_encode($arRes);
die();

<?CJSCore::Init(array("popup"));
?>
<a href="#" class="btn btn-partner nano-modal" data-validate='true' data-title='Request form' data-content='<?=$formContent?>'>Send a Request</a>

function nano__modal(container,settings,callback) {
   var modal = BX.PopupWindowManager.create(container, null, settings);
   return modal;
}

function setModal() {   
   var el = this;
   el.title = ''
   if(el.dataset.title){
      el.title = el.dataset.title
   }
   el.content = ''
   if(el.dataset.content){
      el.content = el.dataset.content
   }
   let className = '';
   if(el.dataset.class){
      className = el.dataset.class
   }
   let eventsPopup = {
         onAfterPopupShow: (el.dataset.validate)? validatePopUp: function(){},
         onPopupShow: function(){            
            $('body').addClass('popupShow');
         },
         onPopupClose: function(){           
            $('body').removeClass('popupShow');
         }
   }


   var modal = nano__modal(window.body, {
      autoHide: false,
      lightShadow: true,
      closeIcon: true,
      closeByEsc: true,
      className:className,
      titleBar: {content: BX.create('h3', {html: el.title, 'props': {'className': 'text-center'}})},
      overlay: {   backgroundColor: 'transparent', opacity: '0'},
      events: eventsPopup
   });

   modal.setContent(el.content);
   modal.show();

}

$(document).ready(function(){
   $('.nano-modal').on('click',function(e){   
        e.preventDefault();
   });
   $('.nano-modal').on('click',setModal);
   $(document).on('click','.popup-window-overlay',function(){   
        $('.popup-window-close-icon').trigger("click");
   });   
});

\CJSCore::init(array("jquery"));

$arJsConfig = [
  'myJsLibrary1' => [    
     'js' => 'my1.js',    
     'css' => 'my1.css',   
     'rel' =>[],   
   ],
  'myJsLibrary2' => [    
     'js' => 'my2.js',    
     'css' => 'my2.css',   
     'rel' =>['jquery'],   
  ]
];

foreach ($arJsConfig as $nameExt => $arExt) {  
 \CJSCore::RegisterExt($nameExt, $arExt);
}

CJSCore::Init(array("myJsLibrary1"));

if(CJSCore::IsExtRegistered('myJsLibrary1')){
   echo 'Y';
}

console.log(eventName, arEventParams);

 value: function emit(eventName, event) {
      console.log(eventName, event); //тут логируем       
      EventEmitter.emit(this, eventName, event);
      return this;
} 

BX.addCustomEvent('onMyEvent',function () {

});

BX.fireEvent(BX('elementId'),'change');

BX.onCustomEvent('onMyEvent');

 BX.onCustomEvent('OnBasketChange');