js如何使用document.getElementById()这个属性连接css

发布网友发布时间：2022-04-21 09:37

共4个回答

热心网友时间：2022-04-21 02:57

看到下面的例子了么？
aa.style.backgroundColor = '#ff0000';就可以了

<!DOCTYPE HTML>
<html>
<head>
<meta charset=UTF-8 />
<title>YuGiOh</title>
<style type="text/css">
#wrap {
margin: auto;
position: relative;
width: 80%;
}
</style>
<script type="text/javascript">
window.onload = function ()
    {
    var a = new Array ([
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ], [
            1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
    ]);
    var randX = Math.floor (Math.random () * a.length), randY = Math.floor (Math.random () * a[randX].length);
    a[randX][randY] = 0;
    for ( var i = 0; i < a.length; i++)
    {
    var array = [];
    for ( var j = 0; j < a[i].length; j++)
    {
    var aa = document.createElement ("div");
    aa.style.position = "absolute";
    aa.style.border = '1px solid black';
    aa.style.width = W + "px";
    aa.style.height = H + "px";
    aa.style.left = j * W + "px";
    aa.style.top = i * H + "px";
    aa.id = i + "_" + j;
    if (a[i][j] == 0)
    {
    aa.style.backgroundColor = 'red';
    X = i;
    Y = j;
    }
    else
    {
    aa.style.backgroundColor = 'green';
    }
    wrap.appendChild (aa);
    array.push (aa);
    }
    SITE.push (array);
    }
    }

    var exchange = function (dir)
    {
    var tx = X, ty = Y, d;
    if (dir == 37)
    {
    if (Y < 1)
    {
    return;
    }
    else
    {
    ty--;
    d = 'left';
    }
    }
    else if (dir == 38)
    {
    if (X < 1)
    {
    return;
    }
    else
    {
    tx--;
    d = 'top';
    }
    }
    else if (dir == 39)
    {
    if (Y > SITE[X].length - 2)
    {
    return;
    }
    else
    {
    ty++;
    d = 'left';
    }
    }
    else if (dir == 40)
    {
    if (X > SITE.length - 2)
    {
    return;
    }
    else
    {
    tx++;
    d = 'top';
    }
    }
    var that = SITE[tx][ty];
    var me = SITE[X][Y];
    var sd = that.style[d];
    that.style[d] = me.style[d];
    me.style[d] = sd;
    var tmp = SITE[tx][ty];
    SITE[tx][ty] = SITE[X][Y];
    SITE[X][Y] = tmp;
    X = tx;
    Y = ty;
    }

    var W = 50, H = 50, X = -1, Y = -1, SITE = [];
    document.onkeydown = function (e)
    {
    e = e || window.event;
    var keyCode = e.keyCode;
    if (!/^(37|38|39|40)$/.test (keyCode))
    {
    return false;
    }
    exchange (keyCode);
    };

    document.ondragstart = document.onselectstart = document.oncontextmenu = function ()
    {
    return false;
    }
</script>
</head>
<body>
<div id="wrap"></div>
</body>
</html>

热心网友时间：2022-04-21 04:15

js可以使用document.getElementById()来装在对应的css文件，具体实现如下：
1、以下是封装好的利用JS加载外部CSS文件的函数：
<script type="text/javascript" language="JavaScript">
function loadCss(file){
var cssTag=document.getElementById('loadCss');
var head=document.getElementsByTagName('head').item(0);
if(cssTag) head.removeChild(cssTag);
css=document.createElement('link');
css.href=""+file+".css";
css.rel='stylesheet';
css.type='text/css';
css.id='loadCss';
head.appendChild(css);
}
</script>

2、下边的代码就是实际调用时候的应用范例：
<script type="text/javascript" language="JavaScript">
if(check_os()=='Linux') {
loadCss('ubuntuonly_css_patch');
} else {}
</script>

热心网友时间：2022-04-21 05:49

document.getElementById('div1').className='testClass;//'testClass是值css样式名称

热心网友时间：2022-04-21 07:41

不知道你想干什么document.getElementById()是用来获取dom节点的，你想干嘛？

全部栏目

js如何使用document.getElementById()这个属性连接css