Home  >  Article  >  Web Front-end  >  css invalid_html/css_WEB-ITnose

css invalid_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:22:39984browse

CSS

I wrote an inline style in the page, but when I use js to load new html, the class corresponding to it has no effect. Is there any reason why this problem may occur?

Reply to the discussion (solution)

1. Check whether the style has been modified by JS
2. Whether the style sheet is loaded correctly
3. Check whether the inline style is written Correct
4. Exclude and analyze a section of code to see which section has the problem

1. Check if any js has modified the style
2. Whether the style sheet is loaded correctly
3. Check whether the inline style is written correctly
4. Exclude and analyze a piece of code to see which piece has the problem

My js does not modify the style, just loads the html; first load It works, but when I click to load again, the style becomes invalid; is there anything I should pay attention to when js loads html?


1. Check if any js has modified the style
2. Whether the style sheet is loaded correctly
3. Check whether the inline style is written correctly
4. Exclude and analyze a section of code to see which section has the problem

Mine js does not modify the style, it just loads html; it works fine when loading for the first time, but when I click to load again, the style becomes invalid; is there anything I should pay attention to when loading html with js?


First It worked when I loaded it for the first time, but when I clicked to load again, the style became invalid (please compare the original code that worked for the first load and the original code that failed for the second load to see what the difference is)

There is nothing special to pay attention to when loading HTML with js. The writing is correct and the path is correct.

The style written in ?

Confirm whether it is written as ".class"
Confirm whether it is overwritten by the style written directly on the element


1. Check whether the style has been modified by js
2. Whether the style sheet is loaded correctly
3. Check whether the inline style is written correctly
4. Exclude and analyze a section of code to see which section has the problem

Me The js does not modify the style, it just loads the html; it works fine when loading for the first time, but when I click to load again, the style becomes invalid; is there anything I should pay attention to when loading html with js?

Use chrome or firebug Click to inspect the element, and you can see the dynamically loaded DOM structure. You can distinguish it by comparing it.

I suggest you post the code for everyone to take a look at

What is the style written in ?

Confirm whether it is written as ".class"
Confirm whether it is overwritten by the style written directly on the element

Yes, written in style
The dom structure is the same. I also used chrome to inspect the elements, but the js loaded other data

I suggest you post the code for everyone to take a look at

The code is quite long and difficult to post


The style written in ?

Confirm whether it is written as ".class"
Confirm whether it is overwritten by the style written directly on the element

Yes, written in style
The dom structure is the same. I also used Chrome to inspect the elements. It was just that the js loaded other data
. The styles list in the right column was not loaded or was it overwritten?


I suggest you post the code for everyone to take a look at

The code is too long to post

It’s a calendar

 
        .calendarDiv table
        {
            font-size: 12px;
            border-right: 1px solid #999;
            border-top: 1px solid #999;
        }
        .calendarDiv td, th
        {
            border-left: 1px solid #999;
            border-bottom: 1px solid #999;
            width: 28px;
            padding: 5px 0;
            text-align: center;
        }
        
        .calendarDiv th
        {
            background: #666666;
            color: #fff;
        }
        
        .day
        {
            font-weight: bold;
        }
        .dayActive
        {
            background-color: #9A0000;
            color: #FFFFFF;
        }
        .dayOther
        {
            color: #999999;
            font-weight: bold;
        }
        .other-month
        {
            background: #e8e8e8;
        }
        .current-month
        {
            background: #FFFFFF;
        }
        .ActiveBG
        {
            background: #54ad3f;
        }
        .ActiveClick
        {
            background: #FF9900;
        }
        #contenter
        {
            padding-top:45px;
        }
    


        //table += ('

'+monthNames[month]+' '+year+'

');
        table += ('
');
        table += ('     
<
');
        table += ('     
');
        table += monthNames[month] + ' ' + year;
        table += ('     
');
        table += ('     
>
');
        table += ('
');
        // uncomment the following lines if you'd like to display calendar month based on 'month' and 'view' paramaters from the URL
        //table += ('');
        //table += ('');
        table  = ('');

        table  = '';

        for (d = 0; d < 7; d ) {
            table  = ''   dayNames[d]   '';
        }

        table  = '';

        var days = getDaysInMonth(month, year);
        var firstDayDate = new Date(year, month, 1);
        var firstDay = firstDayDate.getDay();

        var prev_days = getDaysInMonth(month, year);
        var firstDayDate = new Date(year, month, 1);
        var firstDay = firstDayDate.getDay();

        var prev_m = month == 0 ? 11 : month - 1;
        var prev_y = prev_m == 11 ? year - 1 : year;
        var prev_days = getDaysInMonth(prev_m, prev_y);
        firstDay = (firstDay == 0 && firstDayDate) ? 7 : firstDay;

        var i = 0;
        var tempDate = "";
        for (j = 0; j < 42; j ) {

            if ((j < firstDay)) {
                //pre month
                table  = ('                 table  = ('"');
                tempDate = prevYear.toString()   '-'   (prevMonth).toString()   '-'   (prev_days - firstDay   j   1).toString();
                table  = (' onclick="javascript:$.fn.dateevent(''   tempDate   '');"');
                table  = ('>');
                table  = (''   (prev_days - firstDay   j   1)   '');
            } else if ((j >= firstDay   getDaysInMonth(month, year))) {
                //next month
                i = i   1;
                table  = ('                 table  = ('"');
                table  = (' onclick="javascript:$.fn.dateevent(''   nextYear.toString()   '-'   (nextMonth).toString()   '-'   i.toString()   '');"');
                table  = ('>');
                table  = ('                 table  = ('dayOther"')
                table  = ('>');
                table  = i;
                table  = ('');
            } else {
                //now month
                table  = ('                 if (thismonth == month && thisDay == (j - firstDay   1)) {
                    table  = (' dayActive');
                }
                else {
                    table  = ('  current-month daysCss');
                }
                table  = ('"');
                table  = (' onclick="javascript:$.fn.dateevent(''   year.toString()   '-'   (month   1).toString()   '-'   (j - firstDay   1).toString()   '');"');
                table  = ('>');
                table  = ('                 table  = ('day"')
                table  = ('>');
                table  = (j - firstDay   1);
                table  = ('');
            }
            if (j % 7 == 6) table  = ('');
        }

        table  = ('');

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn