{"id":232,"date":"2026-08-20T23:20:40","date_gmt":"2026-08-20T23:20:40","guid":{"rendered":"https:\/\/tasjil.education\/zh\/?page_id=232"},"modified":"2026-08-20T23:20:40","modified_gmt":"2026-08-20T23:20:40","slug":"tasjil-%e5%85%a5%e5%ad%a6%e7%94%b3%e8%af%b7%e6%9f%a5%e8%af%a2%e5%bc%95%e6%93%8e","status":"publish","type":"page","link":"https:\/\/tasjil.education\/zh\/?page_id=232","title":{"rendered":"Tasjil \u62db\u751f\u67e5\u8be2\u5f15\u64ce"},"content":{"rendered":"        <div class=\"tafe-wrap\" data-lang=\"ar\">\n            <div class=\"tafe-head\">\n                <div class=\"tafe-eyebrow\">\u0645\u062d\u0631\u0643 \u062a\u0633\u062c\u06cc\u0644 \u0644\u0644\u0642\u0628\u0648\u0644 \u0627\u0644\u062c\u0627\u0645\u0639\u064a<\/div>\n                <h2>\u0627\u0628\u062d\u062b \u0639\u0646 \u0627\u0644\u062a\u062e\u0635\u0635 \u0648\u0627\u0644\u062c\u0627\u0645\u0639\u0629 \u0627\u0644\u0623\u0646\u0633\u0628 \u0644\u0643<\/h2>\n                <p>\u0627\u0628\u062d\u062b \u0641\u064a \u0642\u0627\u0639\u062f\u0629 \u0628\u064a\u0627\u0646\u0627\u062a \u062a\u0633\u062c\u06cc\u0644 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629 \u0644\u0644\u062a\u062e\u0635\u0635\u0627\u062a \u0648\u0627\u0644\u062c\u0627\u0645\u0639\u0627\u062a.<\/p>\n            <\/div>\n\n            <div class=\"tafe-searchbar\">\n                <span class=\"tafe-search-icon\" aria-hidden=\"true\">\u2315<\/span>\n                <input id=\"tafe-v0125-q\" type=\"search\"\n                       placeholder=\"\u0627\u0628\u062d\u062b \u0639\u0646 \u062a\u062e\u0635\u0635 \u0623\u0648 \u0643\u0644\u064a\u0629 \u0623\u0648 \u062c\u0627\u0645\u0639\u0629\u2026\"\n                       autocomplete=\"off\">\n            <\/div>\n\n            <div class=\"tafe-results-layout\">\n                <aside id=\"tafe-floating-index\" class=\"tafe-floating-index\" hidden>\n                    <div class=\"tafe-index-card\">\n                        <div class=\"tafe-index-kicker\">\u062a\u0646\u0642\u0644 \u0633\u0631\u064a\u0639<\/div>\n                        <div class=\"tafe-index-title\">\u0627\u0644\u0646\u062a\u0627\u0626\u062c<\/div>\n\n                        <div class=\"tafe-index-slider-wrap\">\n                            <button type=\"button\" class=\"tafe-index-arrow tafe-index-prev\" aria-label=\"\u0627\u0644\u0623\u0642\u0633\u0627\u0645 \u0627\u0644\u0633\u0627\u0628\u0642\u0629\">\u2039<\/button>\n                            <div id=\"tafe-index-links\" class=\"tafe-index-links\"><\/div>\n                            <button type=\"button\" class=\"tafe-index-arrow tafe-index-next\" aria-label=\"\u0627\u0644\u0623\u0642\u0633\u0627\u0645 \u0627\u0644\u062a\u0627\u0644\u064a\u0629\">\u203a<\/button>\n                        <\/div>\n\n                        <div class=\"tafe-mobile-index-dropdown\">\n                            <button type=\"button\" id=\"tafe-index-toggle\" class=\"tafe-index-toggle\" aria-expanded=\"false\">\n                                <span>\u062a\u0635\u0641\u062d \u0623\u0642\u0633\u0627\u0645 \u0627\u0644\u0646\u062a\u0627\u0626\u062c<\/span>\n                                <span class=\"tafe-index-chevron\">\u2304<\/span>\n                            <\/button>\n                            <div id=\"tafe-index-drawer\" class=\"tafe-index-drawer\" hidden><\/div>\n                        <\/div>\n                    <\/div>\n                <\/aside>\n                <div id=\"tafe-v0125-results\" class=\"tafe-results\"><\/div>\n            <\/div>\n\n            <div id=\"tafe-compare-tray\" class=\"tafe-compare-tray\" hidden>\n                <div class=\"tafe-compare-tray-main\">\n                    <strong>\u0645\u0642\u0627\u0631\u0646\u0629 \u0627\u0644\u0627\u062e\u062a\u064a\u0627\u0631\u0627\u062a<\/strong>\n                    <span id=\"tafe-compare-count\">0<\/span>\n                <\/div>\n                <div class=\"tafe-compare-tray-actions\">\n                    <button type=\"button\" id=\"tafe-compare-clear\" class=\"tafe-btn tafe-btn-secondary\">\u0645\u0633\u062d<\/button>\n                    <button type=\"button\" id=\"tafe-compare-open\" class=\"tafe-btn tafe-btn-primary\">\u0642\u0627\u0631\u0646 \u0627\u0644\u0622\u0646<\/button>\n                <\/div>\n            <\/div>\n\n            <div id=\"tafe-compare-modal\" class=\"tafe-compare-modal\" hidden>\n                <div class=\"tafe-compare-backdrop\" data-tafe-compare-close><\/div>\n                <div class=\"tafe-compare-dialog\" role=\"dialog\" aria-modal=\"true\">\n                    <div class=\"tafe-compare-dialog-head\">\n                        <div>\n                            <div class=\"tafe-eyebrow\">\u0645\u0642\u0627\u0631\u0646\u0629 \u062a\u0633\u062c\u06cc\u0644<\/div>\n                            <h3>\u0642\u0627\u0631\u0646 \u0627\u062e\u062a\u064a\u0627\u0631\u0627\u062a\u0643<\/h3>\n                        <\/div>\n                        <button type=\"button\" class=\"tafe-compare-close\" data-tafe-compare-close>\u00d7<\/button>\n                    <\/div>\n                    <div id=\"tafe-compare-table-wrap\"><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <script>\n        (() => {\n            const q = document.getElementById('tafe-v0125-q');\n            const out = document.getElementById('tafe-v0125-results');\n            const tray = document.getElementById('tafe-compare-tray');\n            const countEl = document.getElementById('tafe-compare-count');\n            const clearBtn = document.getElementById('tafe-compare-clear');\n            const openBtn = document.getElementById('tafe-compare-open');\n            const modal = document.getElementById('tafe-compare-modal');\n            const tableWrap = document.getElementById('tafe-compare-table-wrap');\n            if (!q || !out) return;\n\n            let timer = null;\n            const compare = new Map();\n            const maxCompare = 4;\n            const lang = 'ar';\n\n            function esc(s){\n                return String(s ?? '').replace(\/[&<>\"']\/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#039;'}[m]));\n            }\n\n            function syncCompareUI(){\n                const n = compare.size;\n                countEl.textContent = n;\n                tray.hidden = n === 0;\n                openBtn.disabled = n < 2;\n\n                out.querySelectorAll('[data-tafe-compare]').forEach(btn => {\n                    const key = btn.getAttribute('data-compare-key');\n                    const selected = compare.has(key);\n                    btn.classList.toggle('is-selected', selected);\n                    btn.textContent = selected\n                        ? (lang === 'en' ? 'Selected' : '\u062a\u0645 \u0627\u0644\u0627\u062e\u062a\u064a\u0627\u0631')\n                        : (lang === 'en' ? 'Compare' : '\u0645\u0642\u0627\u0631\u0646\u0629');\n                });\n            }\n\n            function bindCompare(scope=document){\n                scope.querySelectorAll('[data-tafe-compare]').forEach(btn => {\n                    if (btn.dataset.compareBound) return;\n                    btn.dataset.compareBound = '1';\n                    btn.addEventListener('click', () => {\n                        const key = btn.getAttribute('data-compare-key');\n                        if (compare.has(key)) {\n                            compare.delete(key);\n                        } else {\n                            if (compare.size >= maxCompare) {\n                                alert(lang === 'en' ? 'You can compare up to 4 choices.' : '\u064a\u0645\u0643\u0646\u0643 \u0645\u0642\u0627\u0631\u0646\u0629 4 \u0627\u062e\u062a\u064a\u0627\u0631\u0627\u062a \u0643\u062d\u062f \u0623\u0642\u0635\u0649.');\n                                return;\n                            }\n                            compare.set(key, {\n                                university: btn.getAttribute('data-university') || '',\n                                universityType: btn.getAttribute('data-university-type') || '',\n                                program: btn.getAttribute('data-program') || '',\n                                tuition: btn.getAttribute('data-tuition') || '',\n                            });\n                        }\n                        syncCompareUI();\n                    });\n                });\n            }\n\n            function renderCompare(){\n                const items = [...compare.values()];\n                if (items.length < 2) return;\n\n                let html = '<div class=\"tafe-compare-table\">';\n                html += '<div class=\"tafe-compare-row tafe-compare-header\"><div><\/div>';\n                items.forEach(i => html += '<div>' + esc(i.university) + '<\/div>');\n                html += '<\/div>';\n\n                const rows = [\n                    [lang === 'en' ? 'University type' : '\u0646\u0648\u0639 \u0627\u0644\u062c\u0627\u0645\u0639\u0629', 'universityType'],\n                    [lang === 'en' ? 'Program' : '\u0627\u0644\u062a\u062e\u0635\u0635', 'program'],\n                    [lang === 'en' ? 'Tuition' : '\u0627\u0644\u0631\u0633\u0648\u0645', 'tuition'],\n                ];\n\n                rows.forEach(([label,key]) => {\n                    html += '<div class=\"tafe-compare-row\"><div class=\"tafe-compare-label\">'+esc(label)+'<\/div>';\n                    items.forEach(i => html += '<div>'+esc(i[key] || (lang === 'en' ? 'Call us' : '\u0627\u062a\u0635\u0644 \u0628\u0646\u0627'))+'<\/div>');\n                    html += '<\/div>';\n                });\n\n                html += '<\/div>';\n                tableWrap.innerHTML = html;\n                modal.hidden = false;\n                document.body.classList.add('tafe-modal-open');\n            }\n\n            function closeCompare(){\n                modal.hidden = true;\n                document.body.classList.remove('tafe-modal-open');\n            }\n\n            clearBtn?.addEventListener('click', () => { compare.clear(); syncCompareUI(); });\n            openBtn?.addEventListener('click', renderCompare);\n            modal?.querySelectorAll('[data-tafe-compare-close]').forEach(el => el.addEventListener('click', closeCompare));\n\n            function bindDynamic(){\n                bindCompare(out);\n\n                out.querySelectorAll('[data-tafe-view-programs], .tafe-view-programs').forEach(btn => {\n                    if (btn.dataset.bound) return;\n                    btn.dataset.bound = '1';\n                    btn.addEventListener('click', () => {\n                        const card = btn.closest('.tafe-card');\n                        const target = card ? card.querySelector('.tafe-program-drawer, .tafe-program-panel') : null;\n                        const uniId = btn.getAttribute('data-university-id');\n\n                        if (!card || !target || !uniId) return;\n\n                        if (target.dataset.loaded === '1') {\n                            target.classList.toggle('is-open');\n                            btn.textContent = target.classList.contains('is-open')\n                                ? (lang === 'en' ? 'Hide programs' : '\u0625\u062e\u0641\u0627\u0621 \u0627\u0644\u062a\u062e\u0635\u0635\u0627\u062a')\n                                : (lang === 'en' ? 'View programs' : '\u0639\u0631\u0636 \u0627\u0644\u062a\u062e\u0635\u0635\u0627\u062a');\n                            return;\n                        }\n\n                        target.classList.add('is-open');\n                        btn.textContent = lang === 'en' ? 'Hide programs' : '\u0625\u062e\u0641\u0627\u0621 \u0627\u0644\u062a\u062e\u0635\u0635\u0627\u062a';\n                        target.innerHTML = '<div class=\"tafe-loading\">\u062c\u0627\u0631\u064a \u062a\u062d\u0645\u064a\u0644 \u0627\u0644\u062a\u062e\u0635\u0635\u0627\u062a\u2026<\/div>';\n\n                        const u = new URL('https:\/\/tasjil.education\/zh\/wp-admin\/admin-ajax.php');\n                        u.searchParams.set('action','tafe_v0125_university_programs');\n                        u.searchParams.set('university_id',uniId);\n                        u.searchParams.set('lang',lang);\n                        u.searchParams.set('_ajax_nonce','ff54b8031a');\n\n                        fetch(u.toString(), {credentials:'same-origin'})\n                            .then(r => r.text())\n                            .then(html => {\n                                target.innerHTML = html;\n                                target.dataset.loaded = '1';\n                                bindProgramFilters(target);\n                                bindCompare(target);\n                            })\n                            .catch(() => target.innerHTML = '<div class=\"tafe-empty\">\u062a\u0639\u0630\u0631 \u062a\u062d\u0645\u064a\u0644 \u0627\u0644\u062a\u062e\u0635\u0635\u0627\u062a.<\/div>');\n                    });\n                });\n            }\n\n            function bindProgramFilters(scope){\n                const search = scope.querySelector('[data-tafe-program-filter], .tafe-program-filter');\n                const group = scope.querySelector('[data-tafe-group-filter]');\n                const rows = [...scope.querySelectorAll('.tafe-program-row')];\n\n                const applyFilter = () => {\n                    const s = (search?.value || '').trim().toLowerCase();\n                    const g = group?.value || '';\n                    rows.forEach(row => {\n                        const text = row.getAttribute('data-search') || '';\n                        const groupId = row.getAttribute('data-group') || '';\n                        const visible = (!s || text.includes(s)) && (!g || groupId === g);\n                        row.style.display = visible ? '' : 'none';\n                    });\n                };\n                search?.addEventListener('input', applyFilter);\n                group?.addEventListener('change', applyFilter);\n            }\n\n\n            const indexWrap = document.getElementById('tafe-floating-index');\n            const resultsLayout = document.querySelector('.tafe-results-layout');\n            const indexLinks = document.getElementById('tafe-index-links');\n            const indexToggle = document.getElementById('tafe-index-toggle');\n            const indexDrawer = document.getElementById('tafe-index-drawer');\n            const indexPrev = document.querySelector('.tafe-index-prev');\n            const indexNext = document.querySelector('.tafe-index-next');\n            let observer = null;\n\n            const slideIndex = (dir) => {\n                if (!indexLinks) return;\n                const amount = Math.max(220, Math.floor(indexLinks.clientWidth * 0.72));\n                indexLinks.scrollBy({left: dir * amount, behavior:'smooth'});\n            };\n            indexPrev?.addEventListener('click', () => slideIndex(-1));\n            indexNext?.addEventListener('click', () => slideIndex(1));\n\n            function slugifyTitle(s){\n                return String(s || '').toLowerCase()\n                    .normalize('NFKD')\n                    .replace(\/[^\\p{L}\\p{N}]+\/gu,'-')\n                    .replace(\/^-+|-+$\/g,'')\n                    .slice(0,80) || 'result';\n            }\n\n\n            indexToggle?.addEventListener('click', () => {\n                const isOpen = indexToggle.getAttribute('aria-expanded') === 'true';\n                indexToggle.setAttribute('aria-expanded', isOpen ? 'false' : 'true');\n                indexDrawer.hidden = isOpen;\n                indexToggle.classList.toggle('is-open', !isOpen);\n            });\n\n            function buildFloatingIndex(){\n                if (!indexWrap || !indexLinks) return;\n\n                const sections = [...out.querySelectorAll('.tafe-program')];\n                if (sections.length < 1) {\n                    indexWrap.hidden = true;\n                    resultsLayout?.classList.remove('has-index');\n                    indexLinks.innerHTML = '';\n                    if (indexDrawer) indexDrawer.innerHTML = '';\n                    if (observer) observer.disconnect();\n                    return;\n                }\n\n                indexLinks.innerHTML = '';\n                if (indexDrawer) indexDrawer.innerHTML = '';\n                const used = new Set();\n\n                sections.forEach((section, i) => {\n                    const heading = section.querySelector('.tafe-program-title h3');\n                    if (!heading) return;\n\n                    let id = 'tafe-section-' + slugifyTitle(heading.textContent) + '-' + i;\n                    while (used.has(id)) id += '-x';\n                    used.add(id);\n                    section.id = id;\n                    section.setAttribute('data-tafe-section','1');\n\n                    const label = heading.textContent.trim();\n\n                    const a = document.createElement('button');\n                    a.type = 'button';\n                    a.className = 'tafe-index-link';\n                    a.setAttribute('data-target', id);\n                    a.textContent = label;\n                    a.addEventListener('click', () => {\n                        section.scrollIntoView({behavior:'smooth', block:'start'});\n                    });\n                    indexLinks.appendChild(a);\n\n                    if (indexDrawer) {\n                        const d = document.createElement('button');\n                        d.type = 'button';\n                        d.className = 'tafe-index-drawer-link';\n                        d.setAttribute('data-target', id);\n                        d.textContent = label;\n                        d.addEventListener('click', () => {\n                            section.scrollIntoView({behavior:'smooth', block:'start'});\n                            indexDrawer.hidden = true;\n                            indexToggle?.setAttribute('aria-expanded','false');\n                            indexToggle?.classList.remove('is-open');\n                        });\n                        indexDrawer.appendChild(d);\n                    }\n                });\n\n                const showIndex = indexLinks.children.length >= 1;\n                indexWrap.hidden = !showIndex;\n                resultsLayout?.classList.toggle('has-index', showIndex);\n\n                if (observer) observer.disconnect();\n                observer = new IntersectionObserver(entries => {\n                    let best = null;\n                    entries.forEach(entry => {\n                        if (entry.isIntersecting) {\n                            if (!best || entry.intersectionRatio > best.intersectionRatio) best = entry;\n                        }\n                    });\n                    if (!best) return;\n                    let activeHorizontal = null;\n                    indexLinks.querySelectorAll('.tafe-index-link').forEach(el => {\n                        const active = el.getAttribute('data-target') === best.target.id;\n                        el.classList.toggle('is-active', active);\n                        if (active) activeHorizontal = el;\n                    });\n\n                    indexDrawer?.querySelectorAll('.tafe-index-drawer-link').forEach(el => {\n                        el.classList.toggle('is-active', el.getAttribute('data-target') === best.target.id);\n                    });\n\n                    if (activeHorizontal && window.matchMedia('(max-width: 980px)').matches) {\n                        activeHorizontal.scrollIntoView({behavior:'smooth', block:'nearest', inline:'center'});\n                    }\n                }, {rootMargin:'-22% 0px -62% 0px', threshold:[0,0.15,0.3,0.6]});\n\n                sections.forEach(s => observer.observe(s));\n            }\n\n            q.addEventListener('input', () => {\n                clearTimeout(timer);\n                const term = q.value.trim();\n                if (term.length < 2) { out.innerHTML=''; return; }\n                resultsLayout?.classList.remove('has-index');\n                if (indexWrap) indexWrap.hidden = true;\n                out.innerHTML = '<div class=\"tafe-loading\">\u062c\u0627\u0631\u064a \u0627\u0644\u0628\u062d\u062b\u2026<\/div>';\n                timer = setTimeout(() => {\n                    const u = new URL('https:\/\/tasjil.education\/zh\/wp-admin\/admin-ajax.php');\n                    u.searchParams.set('action','tafe_v0125_search');\n                    u.searchParams.set('q',term);\n                    u.searchParams.set('lang',lang);\n                    u.searchParams.set('_ajax_nonce','ff54b8031a');\n                    fetch(u.toString(), {credentials:'same-origin'})\n                        .then(r => r.text())\n                        .then(html => { out.innerHTML = html; bindDynamic(); syncCompareUI(); buildFloatingIndex(); })\n                        .catch(() => out.innerHTML = '<div class=\"tafe-empty\">\u062d\u062f\u062b \u062e\u0637\u0623 \u0641\u064a \u0627\u0644\u0628\u062d\u062b. \u062d\u0627\u0648\u0644 \u0645\u0631\u0629 \u0623\u062e\u0631\u0649.<\/div>');\n                }, 250);\n            });\n        })();\n        <\/script>\n        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":0,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-232","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=\/wp\/v2\/pages\/232","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=232"}],"version-history":[{"count":0,"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=\/wp\/v2\/pages\/232\/revisions"}],"wp:attachment":[{"href":"https:\/\/tasjil.education\/zh\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=232"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}