Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/406.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 当代码显示element.style时,如何查找代码的源代码?_Javascript_Html_Css - Fatal编程技术网

Javascript 当代码显示element.style时,如何查找代码的源代码?

Javascript 当代码显示element.style时,如何查找代码的源代码?,javascript,html,css,Javascript,Html,Css,我不知道如何找到这个元素样式代码的来源。例如,在Chrome Element Inspector工具的右侧,它显示以下CSS代码: element.style { position: absolute; left: 0px; top: 0px; width: 486px; height: 200px; overflow: hidden; -webkit-user-select: none; background-color: #FF

我不知道如何找到这个元素样式代码的来源。例如,在Chrome Element Inspector工具的右侧,它显示以下CSS代码:

element.style {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 486px;
    height: 200px;
    overflow: hidden;
    -webkit-user-select: none;
    background-color: #FFF;
    border: 1px solid #ABABAB;
}
在左边是这样的:

<div draggable="false" style="position: absolute; left: 0px; top: 0px; width: 486px; height: 200px; overflow: hidden; -webkit-user-select: none; background-color: white; border: 1px solid rgb(171, 171, 171);"></div>


我已经查看了模块文件,但我只看到JavaScript和HTML文件,没有上面的行?

这是因为这些样式是内联的。这意味着他们使用HTML标记的
style
属性来定义其CSS属性。CSS不在文件或其他地方。它是在应用它的元素的“内部”定义的。

元素。style
只是告诉您,样式是通过
style
属性或JavaScript添加到元素中的,而不是通过外部CSS文件。如果在标记中找不到这些属性,您可以检查JS文件中的这些属性。

该特定的HTML行不需要存在于任何文件中,该div才能存在于DOM中。例如,此Javascript将创建一个如下所示的div:

var div = document.createElement('div');
div.setAttribute('draggable', 'false');
div.style.position = 'absolute';
div.style.overflow = 'hidden';
div.style.cssText += 'left: 0px; top: 0px; width: 486px; height: 200px; -webkit-user-select: none; background-color: white; border: 1px solid rgb(171, 171, 171);';
document.body.appendChild(div);

尝试在JS文件中搜索
-webkit用户选择
。style属性很少被使用,它应该可以帮助您找到Javascript代码的相关部分。

这可能不是您想要的,但是如果您单击inspector右上角的小“+”图标,它可以让您将样式添加到已附加到元素的css类中。执行此操作时,您将能够单击显示在已定义样式右侧的inspector样式表链接。我认为这是最接近定义某种临时样式表的方法,它将包含所有自定义样式


这就是我所做的快速测试。在html中设置一些类,然后在inspector侧面板中添加更多自定义样式-因为在那里编辑和/或选择颜色很容易。然后打开inspector样式表,完成后将它们全部复制。

我刚刚遇到了类似的问题,结果是AdBlocker(浏览器插件)正在插入内嵌样式以隐藏我的网站上它认为是广告的图像。请尝试禁用部分或全部浏览器插件,查看它们是否干扰页面的呈现方式。

似乎是通过某个javascript插件内联添加的。Yes element.style表示它是内联样式。如果您没有添加内联样式,那么它是由js pluginThanks添加的,这就是我的想法,但是我检查了模块Javascript,我找不到代码:-webkit用户选择并检查了模板上的JS文件,但运气不好,软件上也没有Javascript,但有10个JS文件,不知道这些代码是什么或在哪里找到的,为了通过CSS编辑它们,这是可能的?如果没有,我如何编辑它?通过Javascript?