[bootstrap]側邊欄

參考網址:CWC 可收放及響應式的「側邊導覽列」

範例程式中有使用jquery
為了程式的相容性,想將jquery改成純javascript
 

 
//  展開/收合按鈕
$(document).ready(function() {

    $("#collapse").on("click", function() {

        $("#sidebar").toggleClass("active");
        $(".fa-align-left").toggleClass("fa-chevron-circle-right");
    })
})

參考https://stackoverflow.com/questions/18880890/how-do-i-toggle-an-elements-class-in-pure-javascript
改成
 

function tg()  {
	//alert('bbb');    

	const toggleClass = (el, className) => el.classList.toggle(className);
	//$("#sidebar").toggleClass("active");
	toggleClass(document.getElementById('sidebar'),'active');

	//目前無法改
	//$(".fa-align-left").toggleClass("fa-chevron-circle-right");
	//toggleClass(document.getElementById('fa-align-left'),'fa-chevron-circle-right');
	//alert('aaa');
} 

可以收展,但icon無法改,先這樣囉

本篇發表於 程式設計。將永久鏈結加入書籤。