| document.querySelector() | ਬ੍ਰਾਊਜ਼ਰ ਟੈਬ ਦੇ ਸਿਰਲੇਖ ਨੂੰ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਅੱਪਡੇਟ ਕਰਨ ਲਈ HTML ਤੱਤ ਨੂੰ ਚੁਣਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਇਹ ਵਿਧੀ ਉਹਨਾਂ ਦੇ CSS ਚੋਣਕਾਰ ਦੇ ਅਧਾਰ ਤੇ ਤੱਤਾਂ ਦੀ ਚੋਣ ਕਰਨ ਲਈ ਵਿਸ਼ੇਸ਼ ਹੈ, ਅਤੇ ਇੱਥੇ ਇਹ ਚੁਣੇ ਗਏ ਟਾਈਮਰ ਮੁੱਲ ਦੇ ਅਧਾਰ ਤੇ ਪੰਨੇ ਦੇ ਸਿਰਲੇਖ ਨੂੰ ਬਦਲਣ ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ।</td> </tr> <tr> <td>addEventListener()</td> <td>ਇੱਕ ਖਾਸ ਇਵੈਂਟ (ਉਦਾਹਰਨ ਲਈ, ਕਲਿੱਕ) ਨੂੰ ਇੱਕ ਬਟਨ ਤੱਤ ਨਾਲ ਜੋੜਦਾ ਹੈ। ਇਸ ਸੰਦਰਭ ਵਿੱਚ, ਇਸਦੀ ਵਰਤੋਂ changeTimer() ਫੰਕਸ਼ਨ ਨੂੰ ਟਰਿੱਗਰ ਕਰਨ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਜਦੋਂ ਇੱਕ ਉਪਭੋਗਤਾ ਇੱਕ ਬਟਨ ਤੇ ਕਲਿਕ ਕਰਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਟਾਈਮਰ ਸੈਟਿੰਗਾਂ ਨਾਲ ਗਤੀਸ਼ੀਲ ਇੰਟਰੈਕਸ਼ਨ ਦੀ ਆਗਿਆ ਮਿਲਦੀ ਹੈ।</td> </tr> <tr> <td>innerText</td> <td>ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਇੱਕ HTML ਤੱਤ ਦੇ ਅੰਦਰ ਦਿਖਣਯੋਗ ਟੈਕਸਟ ਨੂੰ ਸੋਧਣ ਦੀ ਆਗਿਆ ਦਿੰਦੀ ਹੈ। ਇਸ ਹੱਲ ਵਿੱਚ, ਇਸਦੀ ਵਰਤੋਂ ਪੰਨੇ ਦੇ ਸਿਰਲੇਖ ਵਿੱਚ ਟਾਈਮਰ ਮੁੱਲ ਨੂੰ ਅਪਡੇਟ ਕਰਨ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਜਦੋਂ ਇੱਕ ਬਟਨ ਦਬਾਇਆ ਜਾਂਦਾ ਹੈ।</td> </tr> <tr> <td>onClick</td> <td>ਇੱਕ ਇਨਲਾਈਨ ਈਵੈਂਟ ਹੈਂਡਲਰ ਐਟਰੀਬਿਊਟ ਜੋ ਕਿ ਬਦਲਵੇਂ ਪਹੁੰਚ ਵਿੱਚ ਬਟਨ ਦੇ ਕਲਿੱਕ ਇਵੈਂਟ ਨਾਲ ਸਿੱਧਾ changeTimer() ਫੰਕਸ਼ਨ ਨੂੰ ਜੋੜਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਇਹ ਟਾਈਮਰ ਨੂੰ ਗਤੀਸ਼ੀਲ ਰੂਪ ਵਿੱਚ ਅੱਪਡੇਟ ਕਰਨ ਦੇ ਇੱਕ ਸਰਲ, ਘੱਟ ਮਾਡਿਊਲਰ ਤਰੀਕੇ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ।</td> </tr> <tr> <td>test()</td> <td>ਇਹ ਵਿਧੀ ਜੇਸਟ ਨਾਲ ਯੂਨਿਟ ਟੈਸਟਿੰਗ ਵਿੱਚ ਵਰਤੀ ਜਾਂਦੀ ਹੈ। ਇਹ ਇੱਕ ਟੈਸਟ ਕੇਸ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ ਜਿੱਥੇ ਟੈਸਟ ਕੀਤੇ ਜਾ ਰਹੇ ਫੰਕਸ਼ਨ (ਉਦਾਹਰਨ ਲਈ, changeTimer()) ਦਾ ਮੁਲਾਂਕਣ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਤਾਂ ਜੋ ਇਹ ਯਕੀਨੀ ਬਣਾਇਆ ਜਾ ਸਕੇ ਕਿ ਟਾਈਮਰ ਅੱਪਡੇਟ ਸਹੀ ਢੰਗ ਨਾਲ ਹੋਵੇ। ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਕੋਡ ਵੱਖ-ਵੱਖ ਸਥਿਤੀਆਂ ਵਿੱਚ ਉਮੀਦ ਅਨੁਸਾਰ ਵਿਹਾਰ ਕਰਦਾ ਹੈ।</td> </tr> <tr> <td>expect()</td> <td>ਇੱਕ ਜੈਸਟ ਕਮਾਂਡ ਜੋ ਜਾਂਚ ਕਰਦੀ ਹੈ ਕਿ ਕੀ ਅਸਲ ਮੁੱਲ (ਜਿਵੇਂ ਅੱਪਡੇਟ ਕੀਤਾ ਟਾਈਮਰ) ਅਨੁਮਾਨਿਤ ਮੁੱਲ ਨਾਲ ਮੇਲ ਖਾਂਦਾ ਹੈ। ਇਹ ਪੁਸ਼ਟੀ ਕਰਨ ਲਈ ਯੂਨਿਟ ਟੈਸਟਾਂ ਵਿੱਚ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ ਕਿ ਇੱਕ ਬਟਨ ਕਲਿੱਕ ਕਰਨ ਤੋਂ ਬਾਅਦ gameTime ਅਤੇ document.title ਸਹੀ ਢੰਗ ਨਾਲ ਅੱਪਡੇਟ ਕੀਤੇ ਗਏ ਹਨ।</td> </tr> <tr> <td>toBe()</td> <td>ਇੱਕ ਹੋਰ ਜੈਸਟ ਕਮਾਂਡ ਜੋ ਸਖਤ ਸਮਾਨਤਾ ਦੀ ਜਾਂਚ ਕਰਦੀ ਹੈ। ਇਹ ਸੁਨਿਸ਼ਚਿਤ ਕਰਦਾ ਹੈ ਕਿ changeTimer() ਨੂੰ ਕਾਲ ਕਰਨ ਤੋਂ ਬਾਅਦ, ਗੇਮ ਦਾ ਸਮਾਂ ਬਿਲਕੁਲ ਉਹੀ ਹੈ ਜਿਸਦੀ ਉਮੀਦ ਕੀਤੀ ਜਾਂਦੀ ਹੈ (ਉਦਾਹਰਨ ਲਈ, 30 ਸਕਿੰਟਾਂ ਲਈ 30,000 ms)।</td> </tr> <tr> <td>getElementById()</td> <td>ਉਹਨਾਂ ਦੀ ਆਈਡੀ ਦੁਆਰਾ ਖਾਸ ਬਟਨਾਂ ਨੂੰ ਚੁਣਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ (ਉਦਾਹਰਨ ਲਈ, 'ਤੀਹ', 'ਸੱਠ')। ਇਹ ਵਿਧੀ ਇਵੈਂਟ ਸਰੋਤਿਆਂ ਨੂੰ ਬਟਨਾਂ ਨਾਲ ਜੋੜਨ ਅਤੇ ਉਪਭੋਗਤਾ ਦੀ ਗੱਲਬਾਤ ਦੇ ਜਵਾਬ ਵਿੱਚ ਟਾਈਮਰ ਦੀ ਗਤੀਸ਼ੀਲ ਤਬਦੀਲੀ ਨੂੰ ਚਾਲੂ ਕਰਨ ਲਈ ਮਹੱਤਵਪੂਰਨ ਹੈ।</td> </tr></table><h3 id="dev1">JavaScript ਅਤੇ HTML ਬਟਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਡਾਇਨਾਮਿਕ ਟਾਈਮਰ ਬਣਾਉਣਾ</h3><div class="bordersh3"></div><p>ਉੱਪਰ ਪ੍ਰਦਾਨ ਕੀਤੀਆਂ ਸਕ੍ਰਿਪਟਾਂ ਨੂੰ ਇੱਕ ਉਪਭੋਗਤਾ ਨੂੰ HTML ਬਟਨਾਂ 'ਤੇ ਕਲਿੱਕ ਕਰਕੇ ਇੱਕ ਟਾਈਪਿੰਗ ਗੇਮ ਵਿੱਚ ਗੇਮ ਟਾਈਮਰ ਨੂੰ ਗਤੀਸ਼ੀਲ ਰੂਪ ਵਿੱਚ ਵਿਵਸਥਿਤ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦੇਣ ਲਈ ਤਿਆਰ ਕੀਤਾ ਗਿਆ ਹੈ। ਸ਼ੁਰੂ ਵਿੱਚ, ਅਸੀਂ ਇੱਕ ਵੇਰੀਏਬਲ ਘੋਸ਼ਿਤ ਕਰਦੇ ਹਾਂ <b>ਖੇਡ ਦਾ ਸਮਾਂ</b>, ਜੋ ਮਿਲੀਸਕਿੰਟ ਵਿੱਚ ਸਮਾਂ ਰੱਖਦਾ ਹੈ (ਮੂਲ ਸਕਿੰਟ ਵਿੱਚ 30 ਸਕਿੰਟ, ਮਿਲੀਸਕਿੰਟ ਵਿੱਚ ਬਦਲਣ ਲਈ 1000 ਨਾਲ ਗੁਣਾ)। ਮੁੱਖ ਕਾਰਜਕੁਸ਼ਲਤਾ ਵਿੱਚ ਹੈ <b>ਟਾਈਮਰ ਬਦਲੋ</b> ਫੰਕਸ਼ਨ, ਜੋ ਕਿ ਕਲਿੱਕ ਕੀਤੇ ਬਟਨ ਦੇ ਆਧਾਰ 'ਤੇ ਟਾਈਮਰ ਮੁੱਲ ਨੂੰ ਅੱਪਡੇਟ ਕਰਦਾ ਹੈ। ਇਹ ਵਿਧੀ ਬਟਨ ਦਾ ਮੁੱਲ ਪ੍ਰਾਪਤ ਕਰਦੀ ਹੈ (ਉਦਾ., 30, 60, ਜਾਂ 90) ਅਤੇ ਅੱਪਡੇਟ ਕਰਦੀ ਹੈ ਖੇਡ ਦਾ ਸਮਾਂ ਅਨੁਸਾਰ ਵੇਰੀਏਬਲ. ਇਸ ਤੋਂ ਇਲਾਵਾ, ਸਕ੍ਰਿਪਟ ਚੁਣੇ ਗਏ ਟਾਈਮਰ ਦੀ ਮਿਆਦ ਨੂੰ ਦਰਸਾਉਣ ਲਈ ਪੰਨੇ ਦੇ ਸਿਰਲੇਖ ਨੂੰ ਅਪਡੇਟ ਕਰਦੀ ਹੈ, ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਇਹ ਸਪੱਸ਼ਟ ਕਰਦੀ ਹੈ ਕਿ ਉਹਨਾਂ ਕੋਲ ਕਿੰਨਾ ਸਮਾਂ ਹੈ।</p><p>ਗਤੀਸ਼ੀਲ ਵਿਵਹਾਰ ਲਈ, ਅਸੀਂ ਇਵੈਂਟ ਸਰੋਤਿਆਂ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਾਂ, ਖਾਸ ਤੌਰ 'ਤੇ <b>AddEventListener</b> ਹੁਕਮ. ਇਹ ਸਕ੍ਰਿਪਟ ਨੂੰ ਪ੍ਰਤੀਕਿਰਿਆ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ ਜਦੋਂ ਉਪਭੋਗਤਾ ਕਿਸੇ ਵੀ ਬਟਨ ਨੂੰ ਕਲਿਕ ਕਰਦਾ ਹੈ। ਹਰੇਕ ਬਟਨ ਨੂੰ ਇੱਕ ID ਨਿਰਧਾਰਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਅਤੇ, ਜਦੋਂ ਕਲਿੱਕ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਇਸਨੂੰ ਚਾਲੂ ਕਰਦਾ ਹੈ <b>ਟਾਈਮਰ ਬਦਲੋ</b> ਫੰਕਸ਼ਨ, ਅਨੁਸਾਰੀ ਸਮਾਂ ਮੁੱਲ ਪਾਸ ਕਰਨਾ। ਇਹ ਪਹੁੰਚ HTML ਢਾਂਚੇ ਵਿੱਚ ਦੁਹਰਾਉਣ ਵਾਲੀ ਇਨਲਾਈਨ JavaScript ਦੀ ਲੋੜ ਤੋਂ ਬਿਨਾਂ ਕਈ ਬਟਨਾਂ ਨੂੰ ਕੁਸ਼ਲਤਾ ਨਾਲ ਸੰਭਾਲਣ ਲਈ ਉਪਯੋਗੀ ਹੈ। ਸਕ੍ਰਿਪਟ ਵਿੱਚ ਇੱਕ ਫਾਲਬੈਕ ਵਿਕਲਪ ਵੀ ਸ਼ਾਮਲ ਹੈ ਜਿੱਥੇ ਤੁਸੀਂ ਇਨਲਾਈਨ ਈਵੈਂਟ ਹੈਂਡਲਰ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ <b>onClick</b> ਜੇਕਰ ਸਾਦਗੀ ਨੂੰ ਮਾਡਿਊਲਰਿਟੀ ਨਾਲੋਂ ਤਰਜੀਹ ਦਿੱਤੀ ਜਾਂਦੀ ਹੈ।</p><p>ਵਿਕਲਪਕ ਹੱਲ ਵਿੱਚ, ਅਸੀਂ ਸਿੱਧੇ ਬੰਨ੍ਹਦੇ ਹਾਂ <b>onClick</b> ਬਟਨ ਨੂੰ ਘਟਨਾ. ਇਹ ਵਿਧੀ ਨੂੰ ਚਲਾਉਂਦੀ ਹੈ <b>ਟਾਈਮਰ ਬਦਲੋ</b> ਫੰਕਸ਼ਨ ਸਿੱਧੇ ਬਟਨ 'ਤੇ ਕਲਿੱਕ ਕੀਤਾ ਜਾ ਰਿਹਾ ਹੈ. ਇਹ ਇੱਕ ਸਿੱਧੀ ਪਹੁੰਚ ਹੈ ਪਰ ਇਵੈਂਟ ਲਿਸਨਰ ਵਿਧੀ ਦੀ ਲਚਕਤਾ ਦੀ ਘਾਟ ਹੈ। ਇਸ ਵਿਧੀ ਦੀ ਸਰਲਤਾ ਛੋਟੀਆਂ, ਘੱਟ ਗੁੰਝਲਦਾਰ ਐਪਲੀਕੇਸ਼ਨਾਂ ਲਈ ਲਾਭਦਾਇਕ ਹੈ। ਹਾਲਾਂਕਿ, ਵਧੇਰੇ ਸਕੇਲੇਬਲ ਕੋਡ ਲਈ, ਇਵੈਂਟ ਸੁਣਨ ਵਾਲੇ ਵਧੇਰੇ ਲਚਕਤਾ ਦੀ ਪੇਸ਼ਕਸ਼ ਕਰਦੇ ਹਨ ਅਤੇ HTML ਢਾਂਚੇ ਨੂੰ ਸਿੱਧੇ ਤੌਰ 'ਤੇ ਸੋਧੇ ਬਿਨਾਂ ਸਕ੍ਰਿਪਟ ਨੂੰ ਆਸਾਨ ਅੱਪਡੇਟ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦੇ ਹਨ। ਦੋਵੇਂ ਤਰੀਕਿਆਂ ਦਾ ਉਦੇਸ਼ ਇੱਕੋ ਸਮੱਸਿਆ ਨੂੰ ਹੱਲ ਕਰਨਾ ਹੈ, ਜੋ ਕਿ ਟਾਈਮਰ ਨੂੰ ਵਿਵਸਥਿਤ ਕਰਨਾ ਅਤੇ ਉਪਭੋਗਤਾ ਦੀ ਚੋਣ ਦੇ ਆਧਾਰ 'ਤੇ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਸਿਰਲੇਖ ਨੂੰ ਅਪਡੇਟ ਕਰਨਾ ਹੈ।</p><p>ਅੰਤ ਵਿੱਚ, ਅਸੀਂ ਜੈਸਟ, ਇੱਕ JavaScript ਟੈਸਟਿੰਗ ਫਰੇਮਵਰਕ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ ਯੂਨਿਟ ਟੈਸਟਾਂ ਨੂੰ ਲਾਗੂ ਕਰਦੇ ਹਾਂ। ਦ <b>ਟੈਸਟ</b> ਇਹ ਪ੍ਰਮਾਣਿਤ ਕਰਨ ਲਈ ਫੰਕਸ਼ਨ ਮਹੱਤਵਪੂਰਨ ਹਨ ਕਿ ਟਾਈਮਰ ਸਹੀ ਢੰਗ ਨਾਲ ਅੱਪਡੇਟ ਹੁੰਦਾ ਹੈ। ਕਈ ਦ੍ਰਿਸ਼ਾਂ ਦੀ ਜਾਂਚ ਕਰਕੇ, ਜਿਵੇਂ ਕਿ ਕੀ ਟਾਈਮਰ 30 ਸਕਿੰਟ, 60 ਸਕਿੰਟ, ਜਾਂ 90 ਸਕਿੰਟਾਂ ਲਈ ਅਨੁਕੂਲ ਹੁੰਦਾ ਹੈ, ਇਹ ਯੂਨਿਟ ਟੈਸਟ ਸਕ੍ਰਿਪਟ ਦੀ ਸ਼ੁੱਧਤਾ ਨੂੰ ਯਕੀਨੀ ਬਣਾਉਂਦੇ ਹਨ। ਵਰਗੇ ਹੁਕਮ <b>ਉਮੀਦ</b> ਅਤੇ <b>ਹੋਣ ਲਈ</b> ਇਹ ਤਸਦੀਕ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ ਕਿ ਅਸਲ ਟਾਈਮਰ ਮੁੱਲ ਅਤੇ ਪੰਨਾ ਸਿਰਲੇਖ ਉਮੀਦ ਕੀਤੇ ਨਤੀਜਿਆਂ ਨਾਲ ਮੇਲ ਖਾਂਦੇ ਹਨ। ਇਹ ਟੈਸਟਿੰਗ ਪੜਾਅ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਤੁਹਾਡਾ ਟਾਈਮਰ ਤਰਕ ਵੱਖ-ਵੱਖ ਵਰਤੋਂ ਦੇ ਮਾਮਲਿਆਂ ਵਿੱਚ ਸਹੀ ਢੰਗ ਨਾਲ ਕੰਮ ਕਰ ਰਿਹਾ ਹੈ, ਤੁਹਾਡੇ ਹੱਲ ਦੀ ਮਜ਼ਬੂਤੀ ਵਿੱਚ ਵਿਸ਼ਵਾਸ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ।<div id="script0"><h3>ਟਾਈਪਿੰਗ ਗੇਮ ਲਈ HTML ਬਟਨਾਂ ਨਾਲ ਟਾਈਮਰ ਮੁੱਲ ਬਦਲਣਾ</h3><div class="bordersh3"></div><p class="langprog">ਡਾਇਨਾਮਿਕ ਟਾਈਮ ਅਪਡੇਟ ਅਤੇ ਟਾਈਟਲ ਐਡਜਸਟਮੈਂਟ ਦੇ ਨਾਲ JavaScript-ਅਧਾਰਿਤ ਫਰੰਟ-ਐਂਡ ਪਹੁੰਚ</p><pre class="language-javascript"><code>// Solution 1: Using event listeners to change timer value dynamically</code>
<code>let gameTime = 30 * 1000; // Default timer set to 30 seconds</code>
<code>const titleElement = document.querySelector('title');</code>
<code>function changeTimer(value) {</code>
<code> gameTime = value * 1000; // Update timer to selected value</code>
<code> titleElement.innerText = value + 's'; // Update the title</code>
<code>}</code>
<code>// Attach event listeners to buttons</code>
<code>document.getElementById('thirty').addEventListener('click', () => changeTimer(30));</code>
<code>document.getElementById('sixty').addEventListener('click', () => changeTimer(60));</code>
<code>document.getElementById('ninety').addEventListener('click', () => changeTimer(90));</code>
<code>// HTML Buttons:</code>
<code>// <button id="thirty" type="button">30s</button></code>
<code>// <button id="sixty" type="button">60s</button></code>
<code>// <button id="ninety" type="button">90s</button></code>
</pre></div><div id="script1"><h3>ਵਿਕਲਪਕ ਪਹੁੰਚ: ਇਨਲਾਈਨ HTML ਅਤੇ JavaScript ਫੰਕਸ਼ਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨਾ</h3><div class="bordersh3"></div><p class="langprog">ਬਟਨ ਕਲਿੱਕ 'ਤੇ ਡਾਇਰੈਕਟ ਫੰਕਸ਼ਨ ਕਾਲਾਂ ਦੇ ਨਾਲ HTML ਵਿੱਚ ਇਨਲਾਈਨ JavaScript</p><pre class="language-javascript"><code><script></code>
<code>let gameTime = 30 * 1000;</code>
<code>function changeTimer(value) {</code>
<code> gameTime = value * 1000;</code>
<code> document.title = value + 's';</code>
<code>}</code>
<code></script></code>
<code><button onClick="changeTimer(30)">30s</button></code>
<code><button onClick="changeTimer(60)">60s</button></code>
<code><button onClick="changeTimer(90)">90s</button></code>
</pre></div><div id="script2"><h3>ਵੱਖ-ਵੱਖ ਵਾਤਾਵਰਣ ਵਿੱਚ ਟਾਈਮਰ ਮੁੱਲ ਤਬਦੀਲੀਆਂ ਲਈ ਯੂਨਿਟ ਟੈਸਟਿੰਗ</h3><div class="bordersh3"></div><p class="langprog">ਫਰੰਟ-ਐਂਡ ਵਾਤਾਵਰਣ ਪ੍ਰਮਾਣਿਕਤਾ ਲਈ ਜੇਸਟ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ JavaScript-ਅਧਾਰਿਤ ਯੂਨਿਟ ਟੈਸਟ</p><pre class="language-javascript"><code>// Jest Test Cases</code>
<code>test('Timer should update to 30 seconds', () => {</code>
<code> changeTimer(30);</code>
<code> expect(gameTime).toBe(30000);</code>
<code> expect(document.title).toBe('30s');</code>
<code>});</code>
<code>test('Timer should update to 60 seconds', () => {</code>
<code> changeTimer(60);</code>
<code> expect(gameTime).toBe(60000);</code>
<code> expect(document.title).toBe('60s');</code>
<code>});</code>
<code>test('Timer should update to 90 seconds', () => {</code>
<code> changeTimer(90);</code>
<code> expect(gameTime).toBe(90000);</code>
<code> expect(document.title).toBe('90s');</code>
<code>});</code>
</pre></div></p><h3>ਟਾਈਮਰ ਕਸਟਮਾਈਜ਼ੇਸ਼ਨ ਨਾਲ ਗੇਮ ਇੰਟਰੈਕਸ਼ਨ ਨੂੰ ਵਧਾਉਣਾ</h3><div class="bordersh3"></div><p>ਟਾਈਪਿੰਗ ਗੇਮ ਵਿੱਚ ਟਾਈਮਰ ਨੂੰ ਬਦਲਣ ਵੇਲੇ ਵਿਚਾਰ ਕਰਨ ਵਾਲਾ ਇੱਕ ਹੋਰ ਪਹਿਲੂ ਹੈ ਸਮੁੱਚਾ ਉਪਭੋਗਤਾ ਅਨੁਭਵ ਅਤੇ ਇੰਟਰਫੇਸ। ਬਟਨਾਂ ਰਾਹੀਂ ਗੇਮ ਟਾਈਮਰ ਨੂੰ ਐਡਜਸਟ ਕਰਨ ਤੋਂ ਇਲਾਵਾ, ਖਿਡਾਰੀਆਂ ਨੂੰ ਉਹਨਾਂ ਦੇ ਚੁਣੇ ਹੋਏ ਟਾਈਮਰ 'ਤੇ ਵਿਜ਼ੂਅਲ ਫੀਡਬੈਕ ਦੇਣਾ ਮਹੱਤਵਪੂਰਨ ਹੈ। ਇਹ ਪੰਨੇ 'ਤੇ ਹੋਰ ਤੱਤਾਂ ਨੂੰ ਅੱਪਡੇਟ ਕਰਕੇ ਪ੍ਰਾਪਤ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ, ਜਿਵੇਂ ਕਿ ਕਾਊਂਟਡਾਊਨ ਡਿਸਪਲੇ। ਟਾਈਮਰ ਸੈਟ ਕਰਨ ਲਈ ਇੱਕ ਬਟਨ ਦਬਾਏ ਜਾਣ ਤੋਂ ਬਾਅਦ, ਕਾਉਂਟਡਾਊਨ ਟਾਈਮਰ ਤੁਰੰਤ ਸ਼ੁਰੂ ਹੋ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ, ਉਪਭੋਗਤਾ ਨੂੰ ਰੀਅਲ-ਟਾਈਮ ਫੀਡਬੈਕ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ। ਇਹ ਸੁਨਿਸ਼ਚਿਤ ਕਰਦਾ ਹੈ ਕਿ ਪਰਸਪਰ ਪ੍ਰਭਾਵ ਨਿਰਵਿਘਨ ਅਤੇ ਅਨੁਭਵੀ ਹੈ, ਖੇਡ ਨੂੰ ਹੋਰ ਰੁਝੇਵੇਂ ਬਣਾਉਂਦਾ ਹੈ।</p><p>ਇਸਨੂੰ ਲਾਗੂ ਕਰਨ ਲਈ, ਤੁਸੀਂ JavaScript ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ <b>setInterval</b> ਫੰਕਸ਼ਨ. ਟਾਈਮਰ ਸੈੱਟ ਹੋਣ ਤੋਂ ਬਾਅਦ, setInterval ਇੱਕ ਕਾਉਂਟਡਾਉਨ ਬਣਾਉਣ ਲਈ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ ਜੋ ਹਰ ਸਕਿੰਟ ਟਾਈਮਰ ਮੁੱਲ ਨੂੰ ਘਟਾਉਂਦਾ ਹੈ। ਜਦੋਂ ਟਾਈਮਰ ਜ਼ੀਰੋ 'ਤੇ ਪਹੁੰਚਦਾ ਹੈ, ਤਾਂ ਫੰਕਸ਼ਨ ਜਾਂ ਤਾਂ ਗੇਮ ਨੂੰ ਰੋਕ ਸਕਦਾ ਹੈ ਜਾਂ ਉਪਭੋਗਤਾ ਨੂੰ ਚੇਤਾਵਨੀ ਦੇ ਸਕਦਾ ਹੈ ਕਿ ਸਮਾਂ ਪੂਰਾ ਹੋ ਗਿਆ ਹੈ। ਇਹ ਕਾਰਜਕੁਸ਼ਲਤਾ, ਬਟਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਟਾਈਮਰ ਨੂੰ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਬਦਲਣ ਦੀ ਯੋਗਤਾ ਦੇ ਨਾਲ ਜੋੜ ਕੇ, ਗੇਮਪਲੇ ਦੇ ਤਜ਼ਰਬੇ ਨੂੰ ਮਹੱਤਵਪੂਰਨ ਤੌਰ 'ਤੇ ਵਧਾਉਂਦੀ ਹੈ। ਇੱਕ ਜਵਾਬਦੇਹ ਇੰਟਰਫੇਸ ਖਿਡਾਰੀਆਂ ਨੂੰ ਰੁਝੇ ਰੱਖਣ ਲਈ ਕੁੰਜੀ ਹੈ, ਅਤੇ ਰੀਅਲ-ਟਾਈਮ ਫੀਡਬੈਕ ਇਸ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਨ ਦਾ ਇੱਕ ਤਰੀਕਾ ਹੈ।</p><p>ਇਸ ਤੋਂ ਇਲਾਵਾ, ਗਲਤੀ ਨਾਲ ਨਜਿੱਠਣ 'ਤੇ ਵਿਚਾਰ ਕੀਤਾ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ. ਉਦਾਹਰਨ ਲਈ, ਜੇਕਰ ਕੋਈ ਉਪਭੋਗਤਾ ਟਾਈਮਰ ਸੈਟ ਕੀਤੇ ਬਿਨਾਂ ਗੇਮ ਸ਼ੁਰੂ ਕਰਨ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰਦਾ ਹੈ, ਤਾਂ ਤੁਸੀਂ ਉਹਨਾਂ ਨੂੰ ਇੱਕ ਵੈਧ ਸਮਾਂ ਚੁਣਨ ਲਈ ਇੱਕ ਸੰਦੇਸ਼ ਦੇ ਨਾਲ ਪੁੱਛ ਸਕਦੇ ਹੋ। ਪ੍ਰਮਾਣਿਕਤਾ ਵਿਧੀਆਂ ਨੂੰ ਸ਼ਾਮਲ ਕਰਕੇ, ਤੁਸੀਂ ਯਕੀਨੀ ਬਣਾਉਂਦੇ ਹੋ ਕਿ ਗੇਮ ਸੁਚਾਰੂ ਢੰਗ ਨਾਲ ਚੱਲਦੀ ਹੈ ਅਤੇ ਸੰਭਾਵੀ ਮੁੱਦਿਆਂ ਨੂੰ ਘਟਾਉਂਦੀ ਹੈ। ਇਸ ਕਿਸਮ ਦੀ ਪ੍ਰਮਾਣਿਕਤਾ ਨਾ ਸਿਰਫ਼ ਉਪਭੋਗਤਾ ਅਨੁਭਵ ਨੂੰ ਬਿਹਤਰ ਬਣਾਉਂਦੀ ਹੈ ਬਲਕਿ ਤੁਹਾਡੀ ਗੇਮ ਦੀ ਭਰੋਸੇਯੋਗਤਾ ਵਿੱਚ ਵੀ ਯੋਗਦਾਨ ਪਾਉਂਦੀ ਹੈ, ਇਹ ਸੁਨਿਸ਼ਚਿਤ ਕਰਦੇ ਹੋਏ ਕਿ ਖਿਡਾਰੀਆਂ ਨੂੰ ਬੇਲੋੜੀ ਉਲਝਣ ਦਾ ਸਾਹਮਣਾ ਨਾ ਕਰਨਾ ਪਵੇ।</p><div id="newfaq"><div id="adsense-article-faq"></div><h4 id="faq">JavaScript ਵਿੱਚ ਟਾਈਮਰ ਕਸਟਮਾਈਜ਼ੇਸ਼ਨ ਬਾਰੇ ਆਮ ਸਵਾਲ</h4><div class="bordersh4"></div><ol> <li>ਮੈਂ ਕਿਵੇਂ ਵਰਤਾਂ <strong>setInterval</strong> ਇੱਕ ਕਾਉਂਟਡਾਊਨ ਬਣਾਉਣ ਲਈ?</li> <li>ਤੁਸੀਂ ਵਰਤ ਸਕਦੇ ਹੋ <strong>setInterval</strong> ਹਰ 1000 ਮਿਲੀਸਕਿੰਟ (1 ਸਕਿੰਟ) ਨੂੰ ਚਲਾਉਣ ਲਈ ਸੈੱਟ ਕਰਕੇ ਅਤੇ ਹਰ ਵਾਰ ਟਾਈਮਰ ਮੁੱਲ ਨੂੰ ਘਟਾ ਕੇ। ਜਦੋਂ ਮੁੱਲ ਜ਼ੀਰੋ ਤੱਕ ਪਹੁੰਚ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਤੁਸੀਂ ਇਸਦੀ ਵਰਤੋਂ ਕਰਕੇ ਕਾਉਂਟਡਾਊਨ ਨੂੰ ਰੋਕ ਸਕਦੇ ਹੋ <strong>clearInterval</strong>.</li> <li>ਦਾ ਮਕਸਦ ਕੀ ਹੈ <strong>clearInterval</strong>?</li> <li><strong>clearInterval</strong> ਕਾਊਂਟਡਾਊਨ ਜਾਂ ਕਿਸੇ ਹੋਰ ਆਵਰਤੀ ਕਾਰਵਾਈ ਨੂੰ ਰੋਕਣ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ <strong>setInterval</strong>. ਇਹ ਯਕੀਨੀ ਬਣਾਉਣਾ ਮਹੱਤਵਪੂਰਨ ਹੈ ਕਿ ਕਾਊਂਟਡਾਊਨ ਰੁਕ ਜਾਵੇ ਜਦੋਂ ਇਹ ਸਿਫ਼ਰ 'ਤੇ ਪਹੁੰਚ ਜਾਵੇ।</li> <li>ਮੈਂ HTML ਸਿਰਲੇਖ ਨੂੰ ਗਤੀਸ਼ੀਲ ਰੂਪ ਵਿੱਚ ਕਿਵੇਂ ਅਪਡੇਟ ਕਰ ਸਕਦਾ ਹਾਂ?</li> <li>ਵਰਤੋ <strong>document.title</strong> ਪੰਨੇ ਦੇ ਸਿਰਲੇਖ ਦੇ ਪਾਠ ਨੂੰ ਸੈੱਟ ਕਰਨ ਲਈ. ਇਸ ਨੂੰ ਤੁਹਾਡੇ ਅੰਦਰ ਅੱਪਡੇਟ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ <strong>changeTimer</strong> ਚੁਣੇ ਗਏ ਸਮੇਂ ਦੇ ਮੁੱਲ 'ਤੇ ਆਧਾਰਿਤ ਫੰਕਸ਼ਨ।</li> <li>ਕੀ ਮੈਂ ਟਾਈਮਰ ਦੀ ਚੋਣ ਕਰਦੇ ਸਮੇਂ ਉਪਭੋਗਤਾ ਦੀਆਂ ਗਲਤੀਆਂ ਨੂੰ ਸੰਭਾਲ ਸਕਦਾ ਹਾਂ?</li> <li>ਹਾਂ, ਤੁਸੀਂ ਕਾਊਂਟਡਾਊਨ ਸ਼ੁਰੂ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਇਹ ਜਾਂਚ ਕੇ ਪ੍ਰਮਾਣਿਕਤਾ ਜੋੜ ਸਕਦੇ ਹੋ ਕਿ ਕੀ ਇੱਕ ਵੈਧ ਟਾਈਮਰ ਵਿਕਲਪ ਚੁਣਿਆ ਗਿਆ ਹੈ। ਜੇਕਰ ਕੋਈ ਵੈਧ ਸਮਾਂ ਨਹੀਂ ਚੁਣਿਆ ਗਿਆ ਹੈ, ਤਾਂ ਤੁਸੀਂ ਇੱਕ ਚੇਤਾਵਨੀ ਜਾਂ ਪ੍ਰੋਂਪਟ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰ ਸਕਦੇ ਹੋ।</li> <li>ਜਦੋਂ ਇੱਕ ਬਟਨ ਦਬਾਇਆ ਜਾਂਦਾ ਹੈ ਤਾਂ ਮੈਂ ਇੱਕ ਫੰਕਸ਼ਨ ਨੂੰ ਕਿਵੇਂ ਚਾਲੂ ਕਰਾਂ?</li> <li>ਤੁਸੀਂ ਵਰਤ ਕੇ ਇੱਕ ਬਟਨ ਨਾਲ ਇੱਕ ਫੰਕਸ਼ਨ ਜੋੜ ਸਕਦੇ ਹੋ <strong>addEventListener</strong> ਜਾਂ ਸਿੱਧੇ ਵਰਤ ਕੇ <strong>onClick</strong> ਬਟਨ ਦੇ HTML ਤੱਤ ਵਿੱਚ।</li></ol></div><div id="summary"><h4>ਟਾਈਮਰ ਕਸਟਮਾਈਜ਼ੇਸ਼ਨ 'ਤੇ ਅੰਤਿਮ ਵਿਚਾਰ</h4><div class="bordersh4"></div><p>ਟਾਈਪਿੰਗ ਗੇਮ ਵਿੱਚ ਡਾਇਨਾਮਿਕ ਟਾਈਮਰ ਐਡਜਸਟਮੈਂਟਸ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨਾ ਖਿਡਾਰੀ ਦੇ ਅਨੁਭਵ ਵਿੱਚ ਮਹੱਤਵਪੂਰਨ ਸੁਧਾਰ ਕਰਦਾ ਹੈ। ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਸਧਾਰਨ HTML ਬਟਨਾਂ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ ਟਾਈਮਰ ਨੂੰ ਬਦਲਣ ਅਤੇ ਰੀਅਲ-ਟਾਈਮ ਵਿੱਚ ਗੇਮ ਦੇ ਇੰਟਰਫੇਸ ਨੂੰ ਅੱਪਡੇਟ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦੇ ਕੇ, ਡਿਵੈਲਪਰ ਆਪਣੀਆਂ ਗੇਮਾਂ ਨੂੰ ਵਧੇਰੇ ਇੰਟਰਐਕਟਿਵ ਅਤੇ ਲਚਕਦਾਰ ਬਣਾ ਸਕਦੇ ਹਨ। ਇਸ ਕਿਸਮ ਦਾ ਨਿਯੰਤਰਣ ਵੱਖ-ਵੱਖ ਹੁਨਰ ਪੱਧਰਾਂ ਨੂੰ ਅਨੁਕੂਲ ਕਰਨ ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ।</p><p>ਸਭ ਤੋਂ ਵਧੀਆ ਅਭਿਆਸਾਂ ਜਿਵੇਂ ਕਿ ਇਵੈਂਟ ਸੁਣਨ ਵਾਲੇ, ਗਲਤੀ ਨੂੰ ਸੰਭਾਲਣਾ, ਅਤੇ ਯੂਨਿਟ ਟੈਸਟਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਯਕੀਨੀ ਬਣਾਉਂਦਾ ਹੈ ਕਿ ਗੇਮ ਸੁਚਾਰੂ ਢੰਗ ਨਾਲ ਚੱਲਦੀ ਹੈ ਅਤੇ ਇੱਕ ਭਰੋਸੇਯੋਗ ਉਪਭੋਗਤਾ ਅਨੁਭਵ ਪ੍ਰਦਾਨ ਕਰਦੀ ਹੈ। ਇਹਨਾਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨੂੰ ਲਾਗੂ ਕਰਨਾ ਨਾ ਸਿਰਫ਼ ਗੇਮ ਦੀ ਕਾਰਜਕੁਸ਼ਲਤਾ ਨੂੰ ਵਧਾਏਗਾ ਬਲਕਿ ਖਿਡਾਰੀਆਂ ਨੂੰ ਜਵਾਬਦੇਹ, ਉਪਭੋਗਤਾ-ਅਨੁਕੂਲ ਮਕੈਨਿਕਸ ਨਾਲ ਵਧੇਰੇ ਰੁਝੇਵੇਂ ਰੱਖੇਗਾ।</p><div id="source"> <h6>ਟਾਈਮਰ ਕਸਟਮਾਈਜ਼ੇਸ਼ਨ ਲਈ ਸਰੋਤ ਅਤੇ ਹਵਾਲੇ</h6> <div class="bordersh2"></div> <ol> <li>DOM ਹੇਰਾਫੇਰੀ ਅਤੇ ਇਵੈਂਟ ਹੈਂਡਲਿੰਗ ਲਈ JavaScript ਦੀ ਵਰਤੋਂ ਬਾਰੇ ਵਿਸਤ੍ਰਿਤ ਜਾਣਕਾਰੀ 'ਤੇ ਪਾਈ ਜਾ ਸਕਦੀ ਹੈ <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide" target="_blank">MDN ਵੈੱਬ ਡੌਕਸ</a> .</li> <li>ਨੂੰ ਸਮਝਣ ਲਈ <a href="https://jestjs.io/docs/getting-started" target="_blank">ਮਜ਼ਾਕ</a> ਫਰੇਮਵਰਕ ਅਤੇ JavaScript ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਯੂਨਿਟ ਟੈਸਟਿੰਗ ਲਈ ਇਸਦਾ ਲਾਗੂਕਰਨ।</li> <li>ਵਰਤਣ 'ਤੇ ਵਿਆਪਕ ਸਮਝ <a href="https://www.w3schools.com/js/js_htmldom_eventlistener.asp" target="_blank">AddEventListener</a> JavaScript ਵਿੱਚ ਘਟਨਾਵਾਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ W3Schools 'ਤੇ ਉਪਲਬਧ ਹਨ।</li> <li>ਵੈਬ ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਰੀਅਲ-ਟਾਈਮ ਅਪਡੇਟਸ ਦੀ ਮਹੱਤਤਾ, ਟਾਈਮਰ ਸਮੇਤ, ਵਿੱਚ ਚਰਚਾ ਕੀਤੀ ਗਈ ਹੈ <a href="https://www.smashingmagazine.com/2020/02/real-time-app-web/" target="_blank">ਸਮੈਸ਼ਿੰਗ ਮੈਗਜ਼ੀਨ</a> .</li> </ol></div></div> </article>
</div>
<!-- WIDGET RIGHT SIDE SCREEN -->
<div id="article-right" class="col-lg-3 ol-md-12 col-sm-12 col-xs-12">
<aside aria-label="sidebar" id="article-sidebar" class="sidebar sidebar-right">
<div id="adsense-right" class="widget sidebaritem d-none d-md-none d-lg-block adsense-right-vertical-div" page="0">
<!-- <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328" crossorigin="anonymous"></script>
<ins class="adsbygoogle adsense-right-vertical"
style=""
data-ad-client="ca-pub-3922865260272328"
data-ad-slot="9756184449"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script> -->
</div>
<div id="tempmail-slogan" class="widget w-about widget-sidebar sidebaritem" style="z-index:4;position:relative;background-color: white;margin-top:-30px;">
<div class="widget-title">Tempmail.us.com</div>
<div class="bordersh4"></div>
<p id="promotext">ਇੰਟਰਨੈੱਟ 'ਤੇ ਸਭ ਤੋਂ ਵਧੀਆ ਪ੍ਰਦਰਸ਼ਨ ਕਰਨ ਵਾਲੀ ਅਗਿਆਤ ਅਸਥਾਈ ਮੇਲ ਦੀ ਭਾਲ ਕਰ ਰਹੇ ਹੋ? ਸਾਡੀ ਮੁਫਤ ਅਸਥਾਈ ਈ-ਮੇਲ ਸੇਵਾ ਸਭ ਤੋਂ ਸੰਪੂਰਨ ਹੈ, ਈ-ਮੇਲ ਪ੍ਰਾਪਤ ਕਰੋ ਅਤੇ ਭੇਜੋ, ਆਪਣੇ ਮਨਪਸੰਦ ਈ-ਮੇਲਾਂ ਲਈ ਰੀਡਾਇਰੈਕਸ਼ਨ ਬਣਾਓ। ਆਪਣਾ ਪਾਸਵਰਡ ਰੱਖੋ ਅਤੇ ਜੀਵਨ ਭਰ ਲਈ ਆਪਣੀ ਅਸਥਾਈ ਈਮੇਲ ਦੀ ਵਰਤੋਂ ਕਰੋ। POP3, IMAP ਅਤੇ SMTP ਮੁਫ਼ਤ ਵਿੱਚ ਉਪਲਬਧ ਹਨ।</p>
<div style="width:100%;text-align:right;">
<a class="read-more--with-arrow" href="https://www.tempmail.us.com/pa/">
Temp mail
</a>
</div>
</div>
<div id="adsense-article-square"></div>
<div id="blog-ajax" style="margin-top:5px;"></div>
</aside>
</div>
</div>
</div>
</section>
<!-- Footer -->
<svg width="100%" height="4px" xmlns="http://www.w3.org/2000/svg" class="border-footer">
<defs>
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#EB177D;stop-opacity:1" />
<stop offset="25%" style="stop-color:#F9A933;stop-opacity:1" />
<stop offset="50%" style="stop-color:#3BC7EB;stop-opacity:1" />
<stop offset="75%" style="stop-color:#28C182;stop-opacity:1" />
</linearGradient>
</defs>
<rect width="100%" height="5px" fill="url(#grad1)" />
</svg>
<!-- Balise div pour stocker le numéro de page initial -->
<div id="content">
<!-- Contenu de votre page principale -->
<div id="page_count"></div>
</div>
</div>
<!-- ... end Footer -->
<div id="javascript-mobile"></div>
<script>
// Fonction pour charger le script Hotjar
function loadHotjar() {
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:5178820,hjsv:6};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
}
// Écouteur d'événements pour la souris et le toucher
if (typeof interactionDetected === 'undefined') {
let interactionDetected = false; // Déclaration de la variable
// Détecter les mouvements de souris sur desktop
window.addEventListener('mousemove', function() {
if (!interactionDetected) {
interactionDetected = true;
loadHotjar(); // Charge le script Hotjar
}
});
// Détecter les interactions tactiles sur mobile
window.addEventListener('touchstart', function() {
if (!interactionDetected) {
interactionDetected = true;
loadHotjar(); // Charge le script Hotjar
}
});
}
</script>
<script>
// Function to load a script and return a Promise that resolves when the script is loaded
function loadScript(src) {
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.src = src;
script.onload = () => resolve();
script.onerror = () => reject(new Error(`Failed to load script: ${src}`));
document.getElementById('javascript-mobile').appendChild(script);
});
}
// Async function to sequentially load scripts with a delay after jQuery
async function loadScriptsSequentially() {
try {
// Load jQuery first
await loadScript('https://www.tempmail.us.com/js/jquery.min.js');
// Optional: Verify that jQuery is loaded
if (typeof jQuery === 'undefined') {
throw new Error('jQuery did not load correctly.');
}
// Delay of 500ms after jQuery is loaded
//await new Promise(resolve => setTimeout(resolve, 100));
// Load the remaining scripts sequentially
await loadScript('https://www.tempmail.us.com/js/lazysizes.min.js');
//await new Promise(resolve => setTimeout(resolve, 100));
//await loadScript('https://www.tempmail.us.com/js/load-bg-and-webp.js');
await loadScript('https://www.tempmail.us.com/js/prism.js');
// All scripts loaded successfully
console.log('All scripts loaded successfully.');
// You can now execute any code that depends on the loaded scripts
// For example:
$(document).ready(function() {
console.log('jQuery is ready.');
// Your jQuery-dependent code here
});
} catch (error) {
console.error(error);
}
}
pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
// Initiate the script loading based on the window width
if (window.innerWidth < 900) {
loadScriptsSequentially();
}
</script>
<script>
setTimeout(function() {
$(document).ready(function() {
//permettre le copier-coller
// Sélectionnez tous les éléments <pre> dans le document
document.addEventListener('mousemove', function() {
const pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
pageNum = pageCount-1;
var preElements = document.querySelectorAll('div[page="'+ pageNum +'"] pre');
// Parcourez chaque élément <pre>
preElements.forEach(function(preElement, index) {
var preId = "pre" + (index + 1); // ID unique, par exemple : pre1, pre2, pre3, ...
// Créez un élément <img> avec un attribut onclick qui appelle copyCode avec l'ID correspondant
var img = document.createElement("img");
img.src = "https://www.tempmail.us.com/img/copypaste4.png"; // Remplacez par le chemin de votre image
img.alt = "ਕਾਪੀ ਅਤੇ ਪੇਸਟ ਕਰੋ";
img.setAttribute("width", "28.698");
img.setAttribute("height", "35");
img.classList.add("lazyload");
img.setAttribute("onclick", "copyCode('" + preId + "', this)");
// Créez un élément div pour contenir l'image
var imgContainer = document.createElement("div");
imgContainer.appendChild(img);
imgContainer.classList.add("article-copypaste"); // Ajoutez la classe "article-copypaste" à la div
// Insérez le imgContainer avant l'élément <pre>
preElement.parentNode.insertBefore(imgContainer, preElement);
// Attribuez l'ID à l'élément <pre>
preElement.id = preId;
});
var count = 1;
$('.article-copypaste').each(function() {
// Vérifie si la div langprog existe juste au-dessus de chaque div article-copypaste
if ($(this).prev('.langprog').length === 0) {
// Si elle n'existe pas, créez-la
$(this).before('<p class="langprog"><br></p>');
}
});
$('div[page="0"] .langprog').each(function() {
//console.log("test");
// Créez une nouvelle div
var newDiv = $('<div>').text('');
// Ajoutez des classes ou des styles à la nouvelle div si nécessaire
newDiv.attr('id', "pre"+count+"-alert");
//newDiv.attr('display', "none");
// Ajoutez la nouvelle div en haut de la div actuelle
$(this).prepend(newDiv);
count++;
});
document.removeEventListener('mousemove', arguments.callee);
});
});
}, 1000);
//copier les pre & code
function copyCode(preId, button) {
var pre = document.getElementById(preId);
var range = document.createRange();
range.selectNode(pre);
// Supprimer les espaces en début de chaque ligne
var cleanedText = pre.textContent.replace(/^\s+/gm, "");
// Créer un élément temporaire pour copier le texte nettoyé
var temp = document.createElement("textarea");
temp.value = cleanedText;
document.body.appendChild(temp);
temp.select();
document.execCommand("copy");
document.body.removeChild(temp);
button.innerHTML = "Copié !";
setTimeout(function() {
button.innerHTML = "Copier";
}, 1000);
var boxe = "#"+preId+"-alert";
console.log(boxe);
showCopyPaste(boxe,"ਸਮੱਗਰੀ ਨੂੰ ਕਲਿੱਪਬੋਰਡ 'ਤੇ ਕਾਪੀ ਕੀਤਾ ਗਿਆ!","success");
}
function showCopyPaste(id,textbox,info) {
var message = $('div[page="0"] ' + id);
message.text(textbox);
message.removeClass();
if (info=="general") {
message.addClass('alert alert-secondary');
}
if (info=="warning") {
message.addClass('alert alert-warning');
}
if (info=="danger") {
message.addClass('alert alert-danger');
}
if (info=="success") {
message.addClass('alert alert-success');
}
message.fadeIn();
setTimeout(function() {
message.fadeOut();
}, 3000); // 2000 millisecondes = 2 secondes
}
</script>
<script>
setTimeout(function() {
$(document).ready(function () {
pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
pageNum = pageCount-1;
if ( pageNum==0) {
//console.log("repasser par la ");
initPositioning(0); // Initial call for the first page
}
setTimeout(function() {
//parce que le prism est en defer
Prism.highlightAll();
}, 500);
});
$(document).ready(function () {
var ajaxAborted = false;
var page = 1; // Numéro de la page actuelle
var loading = false; // Pour éviter les chargements multiples en même temps
var articlesLoaded = false;
function loadMoreArticles(unusedHeight) {
if (loading || articlesLoaded) return;
// Déclenche la requête AJAX pour charger plus d'articles
$.ajax({
url: 'https://www.tempmail.us.com/02blog-ajax.php', // L'URL du script PHP pour charger les articles
method: 'POST',
data: {
action: 'getArticles',
lang: 'pa',
addQueryCat: "AND catclean='javascript'",
page: page,
currentid: "100096",
unusedHeight: unusedHeight // Utilisez la valeur de hauteur non utilisée ici
},
dataType: 'html',
beforeSend: function (xhr) {
loading = true;
if (ajaxAborted) {
xhr.abort(); // Annuler la requête
}
},
success: function (response) {
// Insérez les nouveaux articles dans la partie vide de la page
if ($(response).find('div').length > 0) {
const pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
pageNum = pageCount-1;
// La division en particulier est trouvée, continuez le traitement
var parentDiv = $('div[page="' + pageNum + '"]');
var blogAjaxElement = parentDiv.find('#blog-ajax');
blogAjaxElement.append(response);
} else {
ajaxAborted = true;
//console.log("aborded");
}
// Incrémente le numéro de page
page++;
loading = false;
articlesLoaded = true;
},
error: function (xhr, status, error) {
// Gérez les erreurs si nécessaire
console.error(error);
}
});
}
// Fonction pour calculer la hauteur non utilisée de manière synchrone
function calculateUnusedHeight() {
const pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
pageNum = pageCount-1;
var parentDiv = $('div[page="' + pageNum + '"]');
var sidebar = parentDiv.find('#article-right')[0];
var sidebarItems = parentDiv.find('.sidebaritem');
var $page = $('[page="' + pageNum + '"]');
var $article = $page.find('#article');
var $newfaq = $page.find('#newfaq');
var totalfaq = $newfaq.outerHeight();
$page.find('[id^=script]').each(function(index) {
totalfaq += $(this).outerHeight();
});
//console.log("total height"+totalfaq )
// Comparer avec la hauteur de #article et ajuster si nécessaire
var $article = $page.find('#article');
var realarticleheight = $article.outerHeight() - (totalfaq);
var totalHeight = realarticleheight;
if (totalfaq>realarticleheight) {
totalHeight = totalfaq;
}
//console.log("test"+totalHeight);
var itemsHeight = 0;
for (var i = 0; i < sidebarItems.length; i++) {
itemsHeight += sidebarItems[i].offsetHeight;
}
var $article = $page.find('#article');
var unusedHeight = $article.outerHeight() - 1600;
//var unusedHeight = (totalHeight+400) - (itemsHeight);
return unusedHeight;
}
// Chargez les premiers articles au chargement de la page
if ($(window).width() > 991) {
setTimeout(function() {
var unusedHeight = calculateUnusedHeight();
//console.log("unUsed"+unusedHeight);
loadMoreArticles(unusedHeight);
}, 1500);
}
});
}, 1000);
</script>
<script>
setTimeout(function() {
$(document).ready(function() {
// Fonction pour vérifier le statut de la publicité AdSense après un délai de 2 secondes
setTimeout(function() {
$(".adsbygoogle").each(function() {
var self = $(this);
var adStatus = self.attr("data-ad-status");
//console.log("test"+adStatus);
if (adStatus === "unfilled") {
removeParentDiv(self); // Appel de la fonction pour manipuler la div parent
}
});
}, 2000); // Attendre 2 secondes
// Fonction pour manipuler la div parent
function removeParentDiv(element) {
var parentDiv = element.closest('#adsense-right');
if (parentDiv.length > 0) {
parentDiv.remove(); // Supprimer la div parent si elle est trouvée
}
}
});
}, 1000);
// Écoute de l'événement de mouvement de la souris pour charger le script Google AdSense lorsque l'utilisateur effectue une action
document.addEventListener('mousemove', function() {
// Chargement du script Google AdSense
//chargerScriptGoogleAdsenseVertical();
var script = document.createElement('script');
script.src = 'https://www.googletagmanager.com/gtag/js?id=G-ESDTKX54VK';
script.async = true;
// Ajoutez le script à l'en-tête du document
document.head.appendChild(script);
// Initialisez Google Tag Manager lorsque le script est chargé
script.onload = function() {
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-ESDTKX54VK');
};
chargerScriptGoogleAdsenseSquare();
// Suppression de l'écouteur d'événements après le premier déclenchement pour éviter de charger le script à nouveau
document.removeEventListener('mousemove', arguments.callee);
});
// Fonction pour charger le script Google AdSense
function chargerScriptGoogleAdsenseSquare() {
// Créez un élément script
var script = document.createElement('script');
script.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
script.async = true;
script.crossOrigin = "anonymous";
// Ajoutez une fonction pour exécuter lorsque le script est chargé
script.onload = function() {
// Créez un élément ins (bloc de publicité AdSense)
var ins = document.createElement('ins');
ins.className = "adsbygoogle adsense-right-square";
ins.style = "";
ins.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
ins.setAttribute('data-ad-slot', '2613927101');
// ins.setAttribute('data-ad-format', 'auto');
// ins.setAttribute('data-full-width-responsive', 'true');
// Ajoutez le bloc de publicité à l'emplacement désiré
var parentElement = document.querySelector('div[page="0"] .widget.adsenselink.d-none.d-md-none.d-lg-block');
parentElement.appendChild(ins);
// Appelez la fonction push() pour afficher la publicité
(adsbygoogle = window.adsbygoogle || []).push({});
// Surveillez les changements de l'attribut data-ad-status de l'élément ins
var observer = new MutationObserver(function(mutationsList, observer) {
mutationsList.forEach(function(mutation) {
if (mutation.attributeName === "data-ad-status") {
// Récupérez la valeur de l'attribut data-ad-status
var status = ins.getAttribute("data-ad-status");
//console.log("Attribut data-ad-status a changé :", status);
// Faites ce que vous devez avec la valeur récupérée
if (status != "filled") {
$('#adsense-right').remove(); // Appel de la fonction pour manipuler la div parent
}
}
});
});
// Configurez l'observateur pour surveiller les changements d'attribut de l'élément ins
observer.observe(ins, { attributes: true });
};
// Ajoutez le script à l'emplacement désiré
var parentElement = document.querySelector('div[page="0"] .widget.adsenselink.d-none.d-md-none.d-lg-block');
parentElement.appendChild(script);
}
function chargerScriptGoogleAdsenseVertical() {
// Création de l'élément script
var script = document.createElement('script');
script.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
script.async = true;
script.crossOrigin = "anonymous";
// Ajout d'une fonction à exécuter lorsque le script est chargé
script.onload = function() {
// Création de l'élément ins (bloc de publicité AdSense)
var ins = document.createElement('ins');
ins.className = "adsbygoogle adsense-right-vertical";
ins.style = "";
ins.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
ins.setAttribute('data-ad-slot', '9756184449');
// Ajout du bloc de publicité à l'emplacement désiré
var parentElement = document.querySelector('div[page="0"] .widget.sidebaritem.d-none.d-md-none.d-lg-block.adsense-right-vertical-div');
parentElement.appendChild(ins);
// Appel de la fonction push() pour afficher la publicité
(adsbygoogle = window.adsbygoogle || []).push({});
var observer = new MutationObserver(function(mutationsList, observer) {
mutationsList.forEach(function(mutation) {
if (mutation.attributeName === "data-ad-status") {
// Récupérez la valeur de l'attribut data-ad-status
var status = ins.getAttribute("data-ad-status");
console.log("Attribut data-ad-status a changé :", status);
// Faites ce que vous devez avec la valeur récupérée
if (status != "filled") {
document.querySelector('div[page="0"] .widget.sidebaritem.d-none.d-md-none.d-lg-block.adsense-right-vertical-div').remove(); // Appel de la fonction pour manipuler la div parent
}
}
});
});
// Configurez l'observateur pour surveiller les changements d'attribut de l'élément ins
observer.observe(ins, { attributes: true });
};
// Ajout du script à l'emplacement désiré
var parentElement = document.querySelector('div[page="0"] .widget.sidebaritem.d-none.d-md-none.d-lg-block.adsense-right-vertical-div');
parentElement.appendChild(script);
}
</script>
<script>
function handleScroll() {
var scrollPosition = window.scrollY; // Position de défilement par rapport au haut de la page
var targetDiv = document.getElementById('navigation'); // Remplacez 'votre-div' par l'ID de votre div cible
// Si la position de défilement est supérieure à 0, ajoutez la classe
if (scrollPosition > 0) {
targetDiv.classList.add('header--fixed'); // Remplacez 'votre-classe' par le nom de la classe que vous souhaitez ajouter
} else {
// Sinon, supprimez la classe
targetDiv.classList.remove('header--fixed');
}
}
// Écoutez l'événement de défilement
window.addEventListener('scroll', handleScroll);
</script>
<script>
setTimeout(function() {
$(document).ready(function () {
// Définir une variable globale pour vérifier si la nouvelle page a été chargée
let nouvellePageChargee = false;
// Fonction pour charger la page suivante
function chargerPageSuivante(url) {
// Charger le contenu de la page suivante via AJAX ou fetch
fetch(url)
.then(response => response.text())
.then(data => {
// Créer un nouvel élément div pour contenir le contenu HTML
const tempDiv = document.createElement('div');
tempDiv.innerHTML = data;
var navigationLogoElements = tempDiv.querySelectorAll('.navigation-logo');
// Parcourir tous les éléments trouvés et ajouter un style pour les cacher
navigationLogoElements.forEach(function(element) {
element.style.display = 'none';
});
var h1ArticleElement = tempDiv.querySelector('#h1article');
// Appliquer le style à l'élément sélectionné
if (h1ArticleElement) {
h1ArticleElement.style.marginBottom = '46px';
h1ArticleElement.style.marginTop = '0px';
h1ArticleElement.style.marginLeft = '10px';
}
var articleheader = tempDiv.querySelector('#article-header');
if (articleheader) {
articleheader.style.paddingBottom = '20px';
articleheader.style.paddingTop = '20px';
}
var h1header = tempDiv.querySelector('#h1article');
if (h1header) {
h1header.style.maxWidth = '70%';
}
var screenWidth = window.innerWidth;
var imgElement = tempDiv.querySelector('.article-main-img');
if (screenWidth > 900 && imgElement) {
imgElement.src = 'https://www.tempmail.us.com/images/80/80738e14f3a3bf39f19b55b8d7992fe0.png/%E0%A8%8F%E0%A8%85%E0%A8%B0%E0%A8%AB%E0%A8%B2-dags-%E0%A8%A6-%E0%A8%86%E0%A8%B0-%E0%A8%AC%E0%A8%B0%E0%A8%AB-%E0%A8%A6-%E0%A8%AB%E0%A8%B2-%E0%A8%95-%E0%A8%B5-%E0%A8%9A-javascript-%E0%A8%85%E0%A8%A7-%E0%A8%B0-%E0%A8%A4-%E0%A8%B8%E0%A8%9F-%E0%A8%B0-%E0%A8%95-%E0%A8%A4-%E0%A8%86-%E0%A8%AA-%E0%A8%B0%E0%A8%95-%E0%A8%B0-%E0%A8%86%E0%A8%B5-%E0%A8%A8-%E0%A8%9A%E0%A8%B2-%E0%A8%89%E0%A8%A3-%E0%A8%B2%E0%A8%88-%E0%A8%9A-%E0%A8%A3-%E0%A8%A4-%E0%A8%86.png';
}
var desktoplogo = tempDiv.querySelector('.newlogo-desktop');
if (desktoplogo) {
var imgElement = document.createElement("img");
imgElement.className = "lazyload";
imgElement.alt = "Temp mail SuperHeros";
if (window.innerWidth > 900) {
imgElement.src = "https://www.tempmail.us.com/images/site/tempmail-superheros.webp";
imgElement.width = 343;
imgElement.height = 350;
desktoplogo.appendChild(imgElement);
}
}
var adsensearticle = tempDiv.querySelector('#adsense-article');
if (adsensearticle) {
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4326653974');
insElement.setAttribute('style', 'display:inline-block;max-width:100%;width:100%;min-height:140px;max-height:140px;padding-top:10px;padding-bottom:0px;');
// Insertion des éléments dans la div #index-adsense
var adsContainer = tempDiv.querySelector('#adsense-article');
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "5px";
//adsContainer.style.marginTop = "5px";
// adsContainer.style.height = "110px";
// adsContainer.style.paddingBottom = "0px";
//adsContainer.style.marginBottom = "5px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
}
var adsensearticlefaq = tempDiv.querySelector('#adsense-article-faq');
if (adsensearticlefaq) {
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4326653974');
insElement.setAttribute('style', 'display:inline-block;max-width:100%;width:100%;min-height:140px;max-height:140px;padding-top:10px;padding-bottom:0px;');
// Insertion des éléments dans la div #index-adsense
var adsContainer = tempDiv.querySelector('#adsense-article-faq');
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "5px";
//adsContainer.style.marginTop = "5px";
// adsContainer.style.height = "110px";
// adsContainer.style.paddingBottom = "0px";
//adsContainer.style.marginBottom = "5px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
}
var adsensearticlefaq = tempDiv.querySelector('#adsense-article-square');
if (adsensearticlefaq) {
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4326653974');
insElement.setAttribute('style', 'display:inline-block;width:100%;height:auto;max-width:100%;min-height:350px;max-height:350px;margin-top:10px;margin-bottom:8px;');
// Insertion des éléments dans la div #index-adsense
var adsContainer = tempDiv.querySelector('#adsense-article-square');
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "5px";
//adsContainer.style.marginTop = "5px";
// adsContainer.style.height = "110px";
// adsContainer.style.paddingBottom = "0px";
//adsContainer.style.marginBottom = "5px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
}
const pageCount = document.querySelectorAll('#content #page_count').length;
//console.log('Nombre de pages chargées:', pageCount);
// Récupérer tous les éléments avec l'attribut page=1 dans tempDiv
const elementsWithPageAttribute = tempDiv.querySelectorAll('[page="0"]');
// Mettre à jour les attributs de ces éléments avec la valeur de pageCount
elementsWithPageAttribute.forEach(element => {
element.setAttribute('page', pageCount);
});
// Extraire et exécuter les scripts de la nouvelle page
const scripts = tempDiv.querySelectorAll('script');
scripts.forEach(script => {
if (script.type !== 'application/ld+json') {
const newScript = document.createElement('script');
// Modifier le contenu du script pour mettre à jour les sélecteurs
let scriptContent = script.textContent;
// Vérifier si le script contient 'page="0"' et le remplacer par la nouvelle valeur de pageCount
// Si le script a un attribut src, le copier
if (script.src) {
newScript.src = script.src;
} else {
// Sinon, copier le contenu du script
let scriptContent = script.textContent;
// Remplacer toutes les occurrences de 'div[page="0"]' par 'div[page="' + pageCount + '"]'
scriptContent = scriptContent.replace(/div\[page="0"\]/g, 'div[page="' + pageCount + '"]');
// Assigner le nouveau contenu au script
newScript.textContent = scriptContent;
}
console.log(newScript)
document.body.appendChild(newScript);
}
});
// Ajouter le contenu de la nouvelle page à la page actuelle
document.getElementById('content').appendChild(tempDiv);
if (pageCount!=0) {
initPositioning(pageCount);
(adsbygoogle = window.adsbygoogle || []).push({});
(adsbygoogle = window.adsbygoogle || []).push({});
(adsbygoogle = window.adsbygoogle || []).push({});
}
// Compter le nombre de div avec l'ID "page_count"
})
.catch(error => {
console.error('Erreur lors du chargement de la page suivante:', error);
});
}
// Événement de défilement de la fenêtre
window.addEventListener('scroll', function() {
// Vérifier si l'utilisateur a atteint le bas de la page
var distanceRestante = document.body.offsetHeight - (window.innerHeight + window.scrollY);
// Vérifier si l'utilisateur est près du bas de la page
if (!nouvellePageChargee && ($(window).scrollTop() + $(window).height()) >= $(document).height() - 100) {
// Mettre à jour l'URL dans la barre d'adresse du navigateur avec l'URL de la page suivante
window.history.pushState({}, '', 'https://www.tempmail.us.com/pa/snowflake/%E0%A8%8F%E0%A8%85%E0%A8%B0%E0%A8%AB%E0%A8%B2-dags-%E0%A8%A6-%E0%A8%86%E0%A8%B0-%E0%A8%AC%E0%A8%B0%E0%A8%AB-%E0%A8%A6-%E0%A8%AB%E0%A8%B2-%E0%A8%95-%E0%A8%B5-%E0%A8%9A-javascript-%E0%A8%85%E0%A8%A7-%E0%A8%B0-%E0%A8%A4-%E0%A8%B8%E0%A8%9F-%E0%A8%B0-%E0%A8%95-%E0%A8%A4-%E0%A8%86-%E0%A8%AA-%E0%A8%B0%E0%A8%95-%E0%A8%B0-%E0%A8%86%E0%A8%B5-%E0%A8%A8-%E0%A8%9A%E0%A8%B2-%E0%A8%89%E0%A8%A3-%E0%A8%B2%E0%A8%88-%E0%A8%9A-%E0%A8%A3-%E0%A8%A4-%E0%A8%86');
// Charger la page suivante
chargerPageSuivante('https://www.tempmail.us.com/pa/snowflake/%E0%A8%8F%E0%A8%85%E0%A8%B0%E0%A8%AB%E0%A8%B2-dags-%E0%A8%A6-%E0%A8%86%E0%A8%B0-%E0%A8%AC%E0%A8%B0%E0%A8%AB-%E0%A8%A6-%E0%A8%AB%E0%A8%B2-%E0%A8%95-%E0%A8%B5-%E0%A8%9A-javascript-%E0%A8%85%E0%A8%A7-%E0%A8%B0-%E0%A8%A4-%E0%A8%B8%E0%A8%9F-%E0%A8%B0-%E0%A8%95-%E0%A8%A4-%E0%A8%86-%E0%A8%AA-%E0%A8%B0%E0%A8%95-%E0%A8%B0-%E0%A8%86%E0%A8%B5-%E0%A8%A8-%E0%A8%9A%E0%A8%B2-%E0%A8%89%E0%A8%A3-%E0%A8%B2%E0%A8%88-%E0%A8%9A-%E0%A8%A3-%E0%A8%A4-%E0%A8%86');
// Désactiver le gestionnaire d'événements de défilement
window.removeEventListener('scroll', arguments.callee);
}
});
});
}, 1000);
</script>
<script>
setTimeout(function() {
$(document).ready(function() {
//mobile image top load after pour le page speed
var imageLoaded = false; // Pour vérifier si l'image a déjà été chargée
$(document).on('touchstart', '*', function(event) {
if (!imageLoaded) {
var $image = $('#lazyImage');
var imageSrc = $image.data('src'); // Récupère l'URL de l'image depuis data-src
// Modifie le src de l'image pour charger l'image
$image.attr('src', imageSrc);
$image.css('min-width', '109%').css('!important', true);
$image.css('height', '250px').css('!important', true);
// Marque l'image comme chargée
imageLoaded = true;
// Optionnel : Désactiver l'écoute de l'événement après chargement pour éviter les appels répétés
$(document).off('touchstart');
}
});
});
}, 1000);
function initPositioning(pageCount) {
if ($(window).width() > 1700) {
var $page = $('[page="' + pageCount + '"]');
console.log("page count"+pageCount);
var $newfaq = $page.find('#newfaq');
if ($newfaq.length) {
var topOffset = 75 + $newfaq.outerHeight() - 30;
var leftOffset = $newfaq.position().left + 30;
//fixed mac issues
if ($(window).width()==2072) {
leftOffset = $newfaq.position().left + 180;
}
if ($(window).width()==1792) {
leftOffset = $newfaq.position().left + 90;
}
if ($(window).width()==1728) {
leftOffset = $newfaq.position().left + 130;
}
if ($(window).width()==2030) {
leftOffset = $newfaq.position().left + 190;
}
// Calculer la hauteur totale de #newfaq et des scripts
var totalHeight = $newfaq.outerHeight();
console.log("CALCUL LA HAUTEUR DU FAQ TOTALHEIGHT"+totalHeight)
var $article = $page.find('#article');
var realarticleheight = $article.outerHeight() - totalHeight;
//console.log("REGARDER LA HAUTEUR DE L'ARTICLE SANS FAQ"+realarticleheight)
//si ya plus de contenue à droite on update sont height
if (totalHeight > realarticleheight) {
// $article.css('height', totalHeight + 'px');
}
var $summary = $page.find('#summary');
if ($summary.length) {
var summaryHeight = $summary.outerHeight();
//console.log("SUMMARY HAUTEUR SI DISPONIBLE "+summaryHeight)
}
// Réinitialiser topOffset après ajustement de #article
topOffset = $newfaq.position().top + $newfaq.outerHeight() - 50;
// Positionner les divs script pour chaque page
$page.find('[id^=script]').each(function(index) {
$(this).css({
'position': 'absolute',
'top': topOffset + 'px',
'left': leftOffset + 'px'
});
topOffset += $(this).outerHeight();
});
var totalHeight = $newfaq.outerHeight();
$page.find('[id^=script]').each(function(index) {
if ($(this).css('position') === 'absolute') {
totalHeight += $(this).outerHeight();
}
});
//console.log("CALCUL LA HAUTEUR DU FAQ + SCRIPT absolute TOTALHEIGHT"+totalHeight)
setTimeout(function() {
if ($("#source").length) {
var source = $page.find('#source');
var sourceHeight = source.outerHeight();
}
var realarticleheight = $article.outerHeight();
var totalleft = realarticleheight;
var totalright = totalHeight-700;
console.log("total left "+totalleft)
console.log("total right"+totalright)
console.log("summary height"+summaryHeight)
console.log("source height"+sourceHeight)
if ($("#source").length) {
if ((totalleft-totalright)>(summaryHeight+sourceHeight)) {
$summary.css({
'position': 'absolute',
'top': (topOffset-50) + 'px',
'left': leftOffset + 'px',
'max-width': '950px'
});
source.css({
'max-width': '950px'
});
if ($(window).width()<2000) {
$summary.css({
'max-width': '750px'
});
source.css({
'max-width': '750px'
});
}
var newrightheight = topOffset+summaryHeight+550;
console.log("new right height"+newrightheight)
console.log("totalleft"+totalleft)
if (newrightheight>totalleft) {
console.log("test")
// $article.css('height', newrightheight-500 + 'px');
}
}
} else {
if ((totalleft-totalright)>(summaryHeight)) {
$summary.css({
'position': 'absolute',
'top': (topOffset-50) + 'px',
'left': leftOffset + 'px',
'max-width': '950px'
});
if ($(window).width()<2000) {
$summary.css({
'max-width': '750px'
});
}
var newrightheight = topOffset+summaryHeight+550;
console.log("new right height"+newrightheight)
console.log("totalleft"+totalleft)
if (newrightheight>totalleft) {
console.log("test")
// $article.css('height', newrightheight-500 + 'px');
}
}
}
}, 1000);
//si le summary est disponible et que le totalheight+smuaarry sont plus petit on le déplace a droite
//SI LE SUMMARY À DROITE PEUT ETRE MISE À GAUCHE POUR BALANCER LA PAGE
/*
if ((totalHeight+summaryHeight) < ((realarticleheight-summaryHeight))) {
}
var $source = $page.find('#source');
if ($(window).width()>2000) {
$source.css({
'position': 'absolute',
'top': (topOffset-50) + 'px',
'left': leftOffset + 'px',
'max-width': '950px'
});
} else {
$source.css({
'position': 'absolute',
'top': (topOffset-50) + 'px',
'left': leftOffset + 'px',
'max-width': '750px'
});
}
*/
//------------------------------------------------------------------------
//ON RECALCUL LE CÖTÉ DROITE APRÈS LES MODIFICATION ET ON CONFIRME LE GAUCHE
var totalHeight = $newfaq.outerHeight();
$page.find('[id^=script]').each(function(index) {
if ($(this).css('position') === 'absolute') {
totalHeight += $(this).outerHeight();
}
});
if ($summary.length) {
totalHeight = totalHeight+$('#summary').outerHeight();
}
var elements = [];
$page.find('[id^=script]').each(function() {
elements.push($(this));
});
// Sort the array by ID in descending order
elements.sort(function(a, b) {
var aNum = parseInt(a.attr('id').replace('script', ''));
var bNum = parseInt(b.attr('id').replace('script', ''));
return bNum - aNum;
});
//console.log("TOTAL HEIGHT VALUE 1 -> "+totalHeight)
var $article = $page.find('#article');
realarticleheight = $article.outerHeight();
//console.log("realarticleheight VALUE 1 -> "+realarticleheight )
//--------------------------------------------------------------------
//-------------------------------------------------------------------- SI LE CÖTÉ DROITE EST PLUS LONG QUE LE CÖTÉ GAUCHE
if (totalHeight > realarticleheight) {
//console.log("TOTAL HEIGHT + GRAND QUE realarticleheight")
var difference = totalHeight - realarticleheight;
var lastStaticElement = null;
if (difference > 500) {
elements.forEach(function(item) {
if ((difference - item.outerHeight()) > 0) {
// Mark the last element that should be static
lastStaticElement = item;
item.css({
'position': 'static',
'top': '',
'left': ''
});
}
// Update the difference for the next iteration
difference -= item.outerHeight();
});
// Apply 'static' only to the last element if it exists
if (lastStaticElement) {
lastStaticElement.css({
'position': 'static',
'top': '',
'left': ''
});
}
}
var totalHeight = $newfaq.outerHeight();
$page.find('[id^=script]').each(function(index) {
if ($(this).css('position') === 'absolute') {
totalHeight += $(this).outerHeight();
}
});
var $article = $page.find('#article');
realarticleheight = $article.outerHeight();
var difference = totalHeight - realarticleheight;
setTimeout(function() {
console.log("difference "+difference);
/*if (difference > 500) {
$summary.css({
'position': 'absolute',
'top': topOffset + 'px',
'left': leftOffset + 'px'
});
} */
// if (difference > 500) {
$summary.css({
'position': 'static',
'top': '',
'left': ''
});
//}
console.log("passer par la")
var $article = $page.find('#article');
// $article.css('height', '11px');
if ($summary.length) {
var summaryHeight = $summary.outerHeight();
if ($summary.css('position') === 'absolute') {
totalHeight = totalHeight;
// $article.css('height', totalHeight + 'px');
}
}
//console.log("TOTAL HEIGHT APRÈS DÉPLACEMENT VERS LA DROITE "+totalHeight)
var $article = $page.find('#article');
//console.log("ARTICLE HEIGHT APRÈS DÉPLACEMENT VER LA DROITE "+$article.outerHeight())
if (totalHeight>$article.outerHeight())
{
// $article.css('height', totalHeight+800 + 'px');
}
}, 2000);
}
//--------------------------------------------------------------------
}
}
}
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
var imgElement = document.createElement("img");
imgElement.className = "lazyload";
imgElement.alt = "Temp mail SuperHeros";
if (window.innerWidth > 900) {
imgElement.src = "https://www.tempmail.us.com/images/site/tempmail-superheros.webp";
imgElement.width = 343;
imgElement.height = 350;
document.querySelector(".newlogo-desktop").appendChild(imgElement);
var img = document.getElementById("article-logo");
if (img) {
img.src = "https://www.tempmail.us.com/images/site/logo-95px.webp";
img.width = 95;
img.height = 90;
}
} else {
imgElement.src = "https://www.tempmail.us.com/images/site/tempmail-superheros-mobile.webp";
imgElement.width = 147;
imgElement.height = 150;
document.querySelector(".newlogo").appendChild(imgElement);
}
});
document.addEventListener("DOMContentLoaded", function() {
var imageBackgroundDiv = document.getElementById('image-background');
if (!imageBackgroundDiv) return; // Exit if the div doesn't exist
var bg320 = imageBackgroundDiv.getAttribute('data-bg-320');
var bg540 = imageBackgroundDiv.getAttribute('data-bg-540');
var bg768 = imageBackgroundDiv.getAttribute('data-bg-768');
var bg1366 = imageBackgroundDiv.getAttribute('data-bg-1366');
var bg1536 = imageBackgroundDiv.getAttribute('data-bg-1536');
var bg1920 = imageBackgroundDiv.getAttribute('data-bg-1920');
var bg2732 = imageBackgroundDiv.getAttribute('data-bg-2732');
var screenWidth = window.innerWidth;
if (screenWidth <= 320) {
imageBackgroundDiv.style.backgroundImage = `url(${bg320})`;
} else if (screenWidth <= 540) {
imageBackgroundDiv.style.backgroundImage = `url(${bg540})`;
} else if (screenWidth <= 768) {
imageBackgroundDiv.style.backgroundImage = `url(${bg768})`;
} else if (screenWidth <= 1366) {
imageBackgroundDiv.style.backgroundImage = `url(${bg1366})`;
} else if (screenWidth <= 1536) {
imageBackgroundDiv.style.backgroundImage = `url(${bg1536})`;
} else if (screenWidth <= 1920) {
imageBackgroundDiv.style.backgroundImage = `url(${bg1920})`;
} else {
imageBackgroundDiv.style.backgroundImage = `url(${bg2732})`;
}
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
var screenWidth = window.innerWidth;
var imgElement = document.querySelector('.article-main-img');
if (screenWidth > 900 && imgElement) {
imgElement.src = 'https://www.tempmail.us.com/images/9a/9a679053963ebb61b232c79134b8a627-766px.webp/html-%E0%A8%AC%E0%A8%9F%E0%A8%A8-%E0%A8%A6-%E0%A8%B5%E0%A8%B0%E0%A8%A4-%E0%A8%95%E0%A8%B0%E0%A8%95-%E0%A8%87-%E0%A8%95-%E0%A8%9F-%E0%A8%88%E0%A8%AA-%E0%A8%97-%E0%A8%97-%E0%A8%AE-%E0%A8%B2%E0%A8%88-javascript-%E0%A8%9F-%E0%A8%88%E0%A8%AE%E0%A8%B0-%E0%A8%AE-%E0%A8%B2-%E0%A8%A8-%E0%A8%95-%E0%A8%B5-%E0%A8%B8-%E0%A8%A7-%E0%A8%86-%E0%A8%9C-%E0%A8%B5-766px.webp';
}
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
document.addEventListener('mousemove', function() {
var windowWidth = window.innerWidth;
if (windowWidth > 900) {
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4326653974');
insElement.setAttribute('style', 'display:inline-block;max-width:100%;width:100%;min-height:140px;max-height:140px;padding-top:10px;padding-bottom:0px;');
// Insertion des éléments dans la div #index-adsense
var adsContainer = document.getElementById("adsense-article");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "5px";
//adsContainer.style.marginTop = "5px";
// adsContainer.style.height = "110px";
// adsContainer.style.paddingBottom = "0px";
//adsContainer.style.marginBottom = "5px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
(adsbygoogle = window.adsbygoogle || []).push({});
// Création des éléments script et ins
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4395216949');
insElement.setAttribute('style', 'display:block;width:100%;height:auto;max-width:100%;min-height:140px;max-height:140px;margin-top:10px;margin-bottom:8px;');
var adsContainer = document.getElementById("adsense-article-faq");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "10px";
// adsContainer.style.paddingBottom = "0px";
// adsContainer.style.marginBottom = "10px";
// adsContainer.style.height = "110px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
if (adsContainer) {
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
// Rechargez les annonces pour qu'elles soient affichées correctement
(adsbygoogle = window.adsbygoogle || []).push({});
}
// Création des éléments script et ins
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4395216949');
insElement.setAttribute('style', 'display:inline-block;width:100%;height:auto;max-width:100%;min-height:350px;max-height:350px;margin-top:10px;margin-bottom:8px;');
var adsContainer = document.getElementById("adsense-article-square");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "10px";
// adsContainer.style.paddingBottom = "0px";
// adsContainer.style.marginBottom = "10px";
// adsContainer.style.height = "110px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
if (adsContainer) {
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
// Rechargez les annonces pour qu'elles soient affichées correctement
(adsbygoogle = window.adsbygoogle || []).push({});
}
}
document.removeEventListener('mousemove', arguments.callee);
});
});
setTimeout(function() {
var pubLoaded = false; // Pour vérifier si l'image a déjà été chargée
$(document).on('touchstart', '*', function(event) {
if (!pubLoaded) {
// Marque la pub comme chargée
pubLoaded = true;
// Optionnel : Désactiver l'écoute de l'événement après chargement pour éviter les appels répétés
$(document).off('touchstart');
var windowWidth = window.innerWidth;
if (windowWidth < 900) {
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4326653974');
insElement.setAttribute('style', 'display:inline-block;max-width:100%;width:100%;min-height:140px;max-height:140px;padding-top:10px;padding-bottom:0px;');
// Insertion des éléments dans la div #index-adsense
var adsContainer = document.getElementById("adsense-article");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "5px";
//adsContainer.style.marginTop = "5px";
// adsContainer.style.height = "110px";
// adsContainer.style.paddingBottom = "0px";
//adsContainer.style.marginBottom = "5px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
(adsbygoogle = window.adsbygoogle || []).push({});
// Création des éléments script et ins
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4395216949');
insElement.setAttribute('style', 'display:block;width:100%;height:auto;max-width:100%;min-height:140px;max-height:140px;margin-top:10px;margin-bottom:8px;');
var adsContainer = document.getElementById("adsense-article-faq");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "10px";
// adsContainer.style.paddingBottom = "0px";
// adsContainer.style.marginBottom = "10px";
// adsContainer.style.height = "110px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
if (adsContainer) {
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
// Rechargez les annonces pour qu'elles soient affichées correctement
(adsbygoogle = window.adsbygoogle || []).push({});
}
// Création des éléments script et ins
var scriptElement = document.createElement('script');
scriptElement.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3922865260272328";
scriptElement.async = true;
scriptElement.crossorigin = "anonymous";
var insElement = document.createElement('ins');
insElement.className = "adsbygoogle";
insElement.style.display = "block";
insElement.setAttribute('data-ad-client', 'ca-pub-3922865260272328');
insElement.setAttribute('data-ad-slot', '4395216949');
insElement.setAttribute('style', 'display:inline-block;width:100%;height:auto;max-width:100%;min-height:350px;max-height:350px;margin-top:10px;margin-bottom:8px;');
var adsContainer = document.getElementById("adsense-article-square");
// adsContainer.style.border = "2px solid #dfe6ec";
// adsContainer.style.paddingTop = "10px";
// adsContainer.style.paddingBottom = "0px";
// adsContainer.style.marginBottom = "10px";
// adsContainer.style.height = "110px";
// adsContainer.style.backgroundColor = "#f7f8fa";
// adsContainer.style.borderRadius = "5px";
if (adsContainer) {
adsContainer.appendChild(scriptElement);
adsContainer.appendChild(insElement);
// Rechargez les annonces pour qu'elles soient affichées correctement
(adsbygoogle = window.adsbygoogle || []).push({});
}
}
}
});
}, 1000);
</script>
</body>
</html>
|
