0

I am new in Django and Python. During working, I am trying to fix the problem all day long but failed. Everything seems okay and working on w3schools and others testing sites also. Here is the two line code from index.js-

alert(window.innerWidth);
document.getElementById("body2").style.color = "#0000ff";

first line shows the window's width but the second line doesn't do anything. I have tried to change color, font-size, weight...etc but nothing works where everything works fine on inline, internal or external css. Only problem on styling from JS. Here, Head section of base.html

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <title>CSP: Home</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <link rel="shortcut icon" type="image/png" href="{% static 'favicon.png' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'base.css' %}">
    {% block ecss %}
    {% endblock %}
</head>

I have linked index.js and index.css through ecss block....

Shafikul Islam
  • 1
  • 1
  • Finally the problem has been fixed by using defer with link for activating the ja after loading the html file and DOM elements. Thanks for trying to help me. – Shafikul Islam Sep 08 '21 at 09:26

1 Answers1

0

You are not using blocks in the correct context when it comes to django because in your code you are doing nothing in your block statement. Anyway, what is block ecss? I would recommend reading this: https://docs.djangoproject.com/en/3.2/ref/templates/language/

If I assume ecss is extra css, if that's the case you can call it in your head:

{% block ecss %}
<link rel="stylesheet" type="text/css" href="{% static 'css/ecss.css' %}">
{% endblock %}

Put your js at the bottom before the end body tag in base.html, in that case would be this (because in your base.html, index.js will be used everywhere):

<script type="text/javascript" src="{% static 'js/index.js' %}"></script>
Who Me Dunno Mate
  • 474
  • 5
  • 15
  • 1
    "_You are not using blocks in the correct context when it comes to django because in your code you are doing nothing in your block statement_", uhh it is quite common to see empty blocks in Django templates which are then filled by the extending templates, the OP has perhaps simply forgotten to show them... – Abdul Aziz Barkat Sep 07 '21 at 13:51