Rumah > hujung hadapan web > tutorial js > Ringkasan cara menggunakan objek textRange dalam kemahiran JavaScript_javascript

Ringkasan cara menggunakan objek textRange dalam kemahiran JavaScript_javascript

WBOY
Lepaskan: 2016-05-16 16:07:56
asal
1137 orang telah melayarinya

Objek Julat Teks ialah ciri lanjutan HTML dinamik (DHTML). Ia boleh digunakan untuk mencapai banyak tugas berkaitan teks, seperti mencari dan memilih teks. Julat teks membolehkan anda memilih aksara, perkataan dan ayat secara selektif daripada dokumen. Objek TextRange ialah objek abstrak yang menetapkan kedudukan mula dan akhir pada aliran teks yang akan dipaparkan oleh dokumen HTML.

Berikut ialah atribut dan kaedah TextRange yang biasa digunakan:

Atribut

boundingHeight mendapat ketinggian segi empat tepat yang terikat pada objek TextRange
boundingLeft mendapat jarak antara tepi kiri segi empat tepat yang terikat pada objek TextRange dan sebelah kiri objek TextRange yang mengandungi
offsetLeft Mendapatkan kedudukan kiri objek yang dikira berbanding dengan reka letak atau koordinat induk yang ditentukan oleh sifat offsetParent
offsetTop mendapat kedudukan teratas objek yang dikira berbanding dengan reka letak atau koordinat induk yang ditentukan oleh sifat offsetParent
htmlTeks mendapat lebar segi empat tepat yang terikat pada objek TextRange
teks menetapkan atau mendapatkan teks yang terkandung dalam julat
Kaedah

moveStart menukar kedudukan permulaan julat
moveEnd menukar kedudukan akhir julat
runtuh mengalihkan titik sisipan ke permulaan atau penghujung julat semasa
move Meruntuhkan julat teks yang diberikan dan mengalihkan julat kosong bilangan sel yang diberikan
execCommand melaksanakan perintah pada dokumen semasa, pemilihan semasa atau julat yang diberikan
pilih menetapkan kawasan pemilihan semasa kepada objek semasa
findText mencari teks dalam teks dan menetapkan titik mula dan akhir julat untuk mengelilingi rentetan carian.
Menggunakan objek TextRange biasanya melibatkan tiga langkah asas:

 1. Buat julat teks

 2. Tetapkan titik mula dan titik akhir

 3. Kendalikan julat

Salin kod Kod adalah seperti berikut:



Alihkan kursor ke kedudukan




1.createTextRange()


Buat objek TextRange seperti BODY, TEXT, TextArea dan BUTTON semuanya menyokong kaedah ini. Kaedah ini mengembalikan objek TextRange.

2.move("Unit"[,count])

Kaedah move() melakukan dua operasi. Pertama, kaedah bertindih dengan dokumen semasa pada titik akhir sebelumnya dan menggunakan ini sebagai titik sisipan seterusnya, ia menggerakkan titik sisipan ke hadapan atau ke belakang dengan sebarang bilangan aksara, perkataan atau unit ayat.

Parameter pertama kaedah ialah rentetan, dan unit yang ditentukan ialah aksara, perkataan, ayat dan suntingan teks. Nilai textedit mengalihkan titik sisipan ke penghujung keseluruhan julat teks (tiada parameter diperlukan). Jika tiga unit pertama ditentukan, nilai lalai ialah 1 apabila parameter diabaikan Anda juga boleh menentukan nilai integer untuk menunjukkan bilangan unit Nombor positif mewakili bergerak ke hadapan, dan nombor negatif mewakili bergerak ke belakang.

Ambil perhatian bahawa julat masih bertindih selepas kaedah move() dilaksanakan.

 3.select()

Kaedah pilih() memilih teks dalam julat teks semasa Kursor paparan di sini juga mesti dilaksanakan menggunakannya, kerana apa yang dipanggil "kursor" boleh difahami sebagai julat di mana sempadannya bertepatan

Salin kod

Kod adalah seperti berikut:





6.parentElement()

Die Methode parentElement() gibt einen Verweis auf den Container zurück, der den Textbereich

enthält

Ruft das DOM-Objekt des vom Cursor ausgewählten Textes ab

Code kopieren Der Code lautet wie folgt:
<script> Funktion getParElem() <br> { <br> var rng = document.selection.createRange(); var container = rng.parentElement(); <br> //alert(container.getAttribute("id")||container.getAttribute("value")||container.getAttribute("type")); alarm(container.tagName); <br> } <br> </script> Dies ist Text, der nur zum Textkörper
gehört
Dies ist der im div
enthaltene Text

Dies ist der in p

enthaltene Text
Dies ist der im div->strong
enthaltene Text


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Cadangan popular
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan