js獲取偽元素選擇器規(guī)定的內(nèi)容代碼實(shí)例
關(guān)于偽元素選擇器可以參閱CSS before/E::before一章節(jié)。
下面介紹一下如何利用js獲取偽元素選擇器定義的內(nèi)容，這種需求在以前可能比較少。
但是隨著瀏覽器的進(jìn)步，偽元素選擇器的實(shí)用會(huì)越來越廣泛。
代碼實(shí)例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="/" />
<title>實(shí)例</title>
<style>
.element:before{
content:'實(shí)例3';
color:rgb(255,0,0);
}
</style>
<script>
window.onload=function(){
var odiv=document.getElementById("show");
var content = window.getComputedStyle(document.querySelector('.element'),':before')
.getPropertyValue('content')
odiv.innerHTML=content;
}
</script>
</head>
<body>
<div class="element"></div>
<div id="show"></div>
</body>
</html>上面的代碼實(shí)現(xiàn)了我們的要求，代碼非常的簡(jiǎn)單，更多內(nèi)容可以參閱相關(guān)閱讀。
（1）.getComputedStyle()方法可以參閱getComputedStyle()和currentStyle一章節(jié)。
（2）.querySelector()方法可以參閱querySelector()一章節(jié)。
相關(guān)推薦
-
通過鼠標(biāo)拖動(dòng)選取指定數(shù)字代碼實(shí)例
在不少的應(yīng)用中，選取數(shù)字的時(shí)候可以通過鼠標(biāo)拖動(dòng)來實(shí)現(xiàn)，這樣的效果人性化的很。下面就分享一個(gè)插件實(shí)現(xiàn)了這樣的功能，這就是jRng，它是利用jQury實(shí)現(xiàn)的。一.HTML代碼部分:首先載入jQur
-
js實(shí)現(xiàn)的獲取選中文本代碼實(shí)例
本章節(jié)介紹一下如何或者被選中的文本內(nèi)容。非常的簡(jiǎn)單，需要的朋友可以做一下參考，代碼實(shí)例如下:
-
原生js的常用dom元素操簡(jiǎn)單介紹
本章節(jié)簡(jiǎn)單介紹幾個(gè)dom元素操作中常用的幾個(gè)方法或者屬性。一.通過id獲取元素對(duì)象:使用documnt.gtlmntById()方法即可實(shí)現(xiàn)此功能。具體可以參閱documnt.gtl
-
nodeJS代碼實(shí)現(xiàn)計(jì)算交社保代碼實(shí)例
下面是一段比較實(shí)用的代碼實(shí)例，是關(guān)于交社保的計(jì)算。代碼實(shí)例如下:fuckShbo: function (rq, rs, nxt) { //每個(gè)月1800的社保 vr dy = (18
-
![node.js [superAgent]請(qǐng)求簡(jiǎn)單代碼實(shí)例](/d/file/titlepic/5/20231204/2013d1.jpg)
node.js [superAgent]請(qǐng)求簡(jiǎn)單代碼實(shí)例
下面分享幾個(gè)不同類型的nod.js [surgnt]請(qǐng)求代碼片段。需要的朋友可以做一下參考，下面進(jìn)入正題。一.ost請(qǐng)求:rqust.ost(/i/t).nd(functi
帝國(guó)CMS模板博客文章資訊自適應(yīng)手機(jī)HTML5網(wǎng)站SEO優(yōu)化版
2023-12-26 14:39:32
美文句子文章網(wǎng)站模板自適應(yīng)作文百科資訊源碼
2023-12-22 17:46:01
帝國(guó)CMS模板個(gè)人博客美文佳句文章資訊自適應(yīng)手機(jī)網(wǎng)站源碼
2023-12-19 18:01:32
帝國(guó)cms簡(jiǎn)潔兩端資訊文章句子網(wǎng)美文源碼詩(shī)句模板
2023-12-13 10:58:14
帝國(guó)cms大氣簡(jiǎn)潔資訊文章博客源碼電商資訊教程網(wǎng)站模板
2023-11-30 13:56:14
